用js做一个简易的网页(用js做一个简易的网页模型)

http://www.itjxue.com  2023-01-24 22:01  来源:未知  点击次数: 

用javascript编写网站简单网站

TMD!

浏览器输入:

打开网页后右键选择浏览源代码

把源代码拷出来 新建一个index.html的文件 用记事本打开,源码复制进去 保存关闭

你想功能多一点的

页面更丰富 这样岂不是更好

一个javascript制作的网页

就说思路吧。

1)

颜色是“#dddddd",要求6个数字随机。

大小是"ddpx",这里就要求10-99随机吧,太大、太小看不到了。

粗细是”font-weight:dddd“,4个数字随机,那些bold也只是特定数字的名称而已。

而javascript字符串中的字符可以用”\udddd“来替换,其中4个随机数字,若是汉字x4e00-x9fa5之间的随机数。

2)问题,都在一个随机数字上。

3)实例化一个标签比如p,然后随机赋予它上述涉及到的style属性,最后设置它的innerText属性把一个随机的汉字当做内容。

其中随机数的函数我试着写一下,

function?getRandom(min,max){

?????min=min||0;

?????max=max||9;

?????var?sp=max-min;

?????var?ad=Math.floor(sp*Math.random());

?????

?????return?min+ad;

?????

}

具体流程,你自己来吧,我只能帮你倒你这里了。

虽然那楼下那个汉子贴出了完整代码,可是限定了范围,不是真随机哇。分数要给哇,我记着要分数去问别人问题,狼哇的捉急哇。555555555555

如何用JS制作以下网页

这样的有几种写法,一个就是发送请求给后台,传的数据是邮箱,然后获取用户名,域名,顶级域名,然后渲染到页面上,但是这得后台配合,第二个就是自己声明假的数据,就是一个数组,里面有多个对象,比如:

input type="text" placeholder="请输入邮箱"

button开始分析/button

div

用户名:span class="username"/span/br

域名:span class="domain"/span/br

顶级域名:span class="top-domain"/span

/div

script type="text/javascript"

var arr = [{email:"xx@163.com",username:"zhangsan",domain:"hao123",topDomain:".com"},{email:"yy@qq.com",username:"lisi",domain:"baidu",topDomain:".com"},{email:"zz@msn.com",username:"wangwu",domain:"taobao",topDomain:".com"}];

var inp = document.getElementsByTagName("input")[0];

var btn = document.getElementsByTagName("button")[0];

var username = document.getElementsByClassName("username")[0];

var domain = document.getElementsByClassName("domain")[0];

var topDomain = document.getElementsByClassName("top-domain")[0];

btn.onclick = function() {

var val = inp.value;

username.textContent = "";

domain.textContent = "";

topDomain.textContent = "";

for (var i=0;iarr.length;i++) {

if (val == arr[i].email) {

username.textContent = arr[i].username;

domain.textContent = arr[i].domain;

topDomain.textContent = arr[i].topDomain;

}

}

}

/script

如何用JS创建一个简单的网页计算器

!doctype?html????

html????

head????

title计算器/title????

meta?charset="utf-8"/????

style?type="text/css"????

.panel{????

?? border:4px?solid?#ddd;????

width:192px;????

margin:100px?auto;????

}????

.panel?p,.panel?input{????

?? font-family:"微软雅黑";????

font-size:20px;????

margin:4px;????

float:left;????

}????

.panel?p{????

?? width:122px;????

height:26px;????

border:1px?solid?#ddd;????

padding:6px;????

overflow:hidden;????

}????

.panel?input{????

? width:40px;????

height:40px;????

border:1px?solid?#ddd;????

}????

/style????

script?type="text/javascript"????

//参数e用来接收传入的event对象????

function?cal(e){????

//1.获取事件源,处理button的事件????

var?obj=e.srcElement||e.target;????

if(obj.nodeName?!="INPUT"){????

? return;????

}????

????

var?value=obj.value;????

var?p=document.getElementById("screen");????

if(value=="C"){????

//2.如果是[C],则清空p????

p.innerText="";????

}else?if(value=="="){????

//3.如果是[=],则运算????

var?exp=p.innerText;????

try{????

var?result=eval("("+exp+")");????

//如果正确执行,将结果写入p????

p.innerText=result;????

}catch(e){????

//发生错误,给予错误提示????

? p.innerText="Error.";????

}????

}else{????

//4.如果是其它按钮,则将value追加到p中????

p.innerText+=value;????

????

}????

}????

/script????

/head????

body????

!--在最外层的div上注册单击事件,传入event对象,然后在函数中通过event判断出事件来源于哪一个button,????

????进而做出应有的处理。这样的好处是,避免在button上大量的注册事件。--????

div?class="panel"?onClick="cal(event);"????

div????

p?id="screen"/p????

input?type="button"?value="C"????

div?style="clear:both"/div????

/div????

div????

input?type="button"?value="7"????

input?type="button"?value="8"????

input?type="button"?value="9"????

input?type="button"?value="/"????

input?type="button"?value="4"????

input?type="button"?value="5"????

input?type="button"?value="6"????

input?type="button"?value="*"????

input?type="button"?value="1"????

input?type="button"?value="2"????

input?type="button"?value="3"????

input?type="button"?value="-"????

input?type="button"?value="0"????

input?type="button"?value="."????

input?type="button"?value="="????

input?type="button"?value="+"????

div?style="clear:both"/div????

/div????

/body????

/html

这是我自学时候写的计算器

JS入门 用javascript 编写一个简单网页

!doctype?html

html?lang="en"

head

meta?charset="UTF-8"

titleDocument/title

script

var?oddSum?=?function(n,fn){

var?sum?=?0;

fn?=?fn?||?function(n){

return?n;

};

for(var?i=0;in;i++){

if((i+1)1==1){

for(var?j=0;ji+1;j++){

if((j+1)1==1)

sum+=fn(j+1);

}

}

}

return?sum;

};

var?factorial?=?function(n){

return?n1???n*factorial(n-1)?:1;?

};

document.write('S=1+(1+3)+(1+3+5)+…+(1+3+5+…+19)'+oddSum(19));

document.write('br');

document.write('S=1!+?(1!+3!?)+(1!+3!+5!)+…+(1!+3!+5!+…+19!)'+oddSum(19,function(n){?return?factorial(n);?}));

/script

/head

body

/body

/html

用javascript制作网页

第一、把所有复选框的name改成一样的

第二、(全选、反选)script type="text/javascript"

//复选框全选

function checkAll(formvalue) {

var roomids = document.getElementsByName(formvalue);

for ( var j = 0; j roomids.length; j++) {

if (roomids.item(j).checked == false) {

roomids.item(j).checked = true;

}

}

}

//复选框全不选

function uncheckAll(formvalue) {

var roomids = document.getElementsByName(formvalue);

for ( var j = 0; j roomids.length; j++) {

if (roomids.item(j).checked == true) {

roomids.item(j).checked = false;

}

}

}

//复选框选择转换

function switchAll(formvalue) {

var roomids = document.getElementsByName(formvalue);

for ( var j = 0; j roomids.length; j++) {

roomids.item(j).checked = !roomids.item(j).checked;

}

}

/script

第三、弹出新页面:script window.open(页面名);script/

(责任编辑:IT教学网)

更多

推荐Flash教程文章