这里为什么不行？-慕课网

首页课程实战体系课手记专栏慕课教程

这里为什么不行？

来源：2-3 DOM2级事件处理程序

飞天意大利面神兽

2016-05-20 10:57

<!DOCTYPE html>

<html>

<head>

window.onload=function(){

var bt=document.createElement("input");

bt.type="button";

bt.value="按钮";

bt.id="btn";

document.body.appendChild(bt);

bt.style.width="160px";

bt.style.height="60px";

}

function asd(){

alert(this.value);

}

var a=document.getElementById("btn");

a.addEventListener("click",asd(),false);

</script>

</head>

<body>

</body>

</html>

如题，加粗有底线的那段无效。。。不知为何。

http://www.imooc.com/video/2134

写回答关注

4回答

weibo_哆啦A梦有大口袋_0

2016-05-23 09:21:41

已采纳

补充:代码执行顺序，从上到下，如果使用window.onload方法，window.onload方法最后执行

1 0

飞天意大利面...

原来如此，感谢

2016-05-23 15:25:42

共 1 条回复 >
weibo_哆啦A梦有大口袋_0

2016-05-23 09:16:23

首先你要明白代码代码是从上倒下执行的，但是window.onload方法的意思就是当HTML结构加载完成后执行里面的代码，因为你的（
var a=document.getElementById("btn");
a.addEventListener("click",asd(),false);
）
没有加在window.onload方法里面,所以被先执行了，但是你这里没有input标签，所以无法添加单击事件。
简而言之，就是你先添加单击事件，再创建DOM节点,所以无法添加事件。
解决问题请采纳，谢谢

0 2

weibo_哆啦A梦有大口袋_0: 2016-05-20 15:50:28

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.onload=function(){
var bt=document.createElement("input");
bt.type="button";
bt.value="按钮";
bt.id="btn";
document.body.appendChild(bt);
bt.style.width="160px";
bt.style.height="60px";
//请把点击事件加载window.onload里面
var a=document.getElementById("btn");
a.addEventListener("click",asd,false);
}
function asd(){
alert(this.value);
}
</script>
</head>
<body>
</body>
</html>

解决问题请采纳，谢谢

1 1

飞天意大利面...

请问为什么要加进去呢？

2016-05-21 12:32:12

共 1 条回复 >