如何用JS制作以下网页

JavaScript036

如何用JS制作以下网页,第1张

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

<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=0i<arr.lengthi++) {

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

username.textContent = arr[i].username

domain.textContent = arr[i].domain

topDomain.textContent = arr[i].topDomain

}

}

}

</script>

<!doctype html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<script>

var oddSum = function(n,fn){

var sum = 0

fn = fn || function(n){

return n

}

for(var i=0i<ni++){

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

for(var j=0j<i+1j++){

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

sum+=fn(j+1)

}

}

}

return sum

}

var factorial = function(n){

return n>1 ? 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>

TMD！

浏览器输入：www.baidu.com

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

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

你想功能多一点的

www.163.com

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