abstract：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>留言信息作业</title> <style type="t
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>留言信息作业</title>
<style type="text/css">
*{margin:0px;padding:0px;}
body{background:#ccc;}
.top{width:800px;height:48px;background-color:black;margin:0px auto;}
.top-text{display:block;font-size:22px;line-height:48px;font-weight:bold;text-align:center;color:#fff}
.liuyan{width:800px;height:48px;position: relative;margin:0px auto;top:10px;}
.ly-text{width:580px;height:44px;font-size:22px;}
.bt{width:200px;height:48px;line-height:48px;position: absolute;left:600px;}
.ly-xs{width:800px;background:black;height:800px;position: relative;margin:0px auto;top:30px;text-align:center;}
.ly-ts{color:limegreen;font-size:22px;font-weight:bold;}
ul{list-style: none;}
ul li{font-size:20px;font-weight:bold;color:limegreen;position: relative;margin:10px auto;}
</style>
</head>
<body>
<div class="top"><span class="top-text">在线留言内容作业</span></div>
<div class="liuyan">
<input type="text" name="info" class="ly-text">
<button class="bt">提交留言内容</button>
</div>
<div class="ly-xs">
<span class="ly-ts">下方为显示留言的内容</span>
<ul></ul>
</div>
<script type="text/javascript">
let input=document.children[0].children[1].children[1].children[0]
let button=document.children[0].children[1].children[1].children[1]
let ul=document.children[0].children[1].children[2].children[1]
button.onclick=function(){
let li=document.createElement('li');
li.innerHTML=input.value;
ul.appendChild(li)
input.value='';
}
</script>
</body>
</html>
虽然功能实现了 但是老师 我想问下 我用了children的方法才获取到了div下的需要的元素 开始我直接用选择器的方法 为什么获取不到div下的input框以及按钮等等需要的元素呢？
还有一个问题，如果要获取到页面中的元素 一定要把js代码放到body代码中创建的元素的下面嘛？我开始放在head头部一样获取不到 后来发现连body都获取不到
Correcting teacher：韦小宝Correction time：2019-02-28 09:12:06
Teacher's summary：首先是第一个问题 你通过选择器的方式是可以直接获取到对应的元素啊
第二个问题 因为在代码运行的过程中 是从上到下运行的 把js放在head中还没等需要的标签实现 js就已经跑过了 不过你要是写成方法也就可以了