為什么將JS插在HTML文檔中起作用,而從外部引用就不起作用?求高人指點!
起作用的模式
<!DOCTYPE?html>
<html>
<head>
<meta?charset="UTF-8">
<title>事件流</title>
<script?src='wrap.js'></script>
<script?src='event.js'></script>
</head>
<body>
<input?type="button"?value="按鈕"?id='mybtn'?/>
<script?type="text/javascript">
var?eventFlow={?//創建一個實例
addHander:function(element,type,hander){?//創建一個方法:addEvent用來添加事件
if(element.addEventListener){
element.addEventListener(type,hander,false);
}else?if(element.attachEvent){
element.attachEvent('on'+type,hander);
}else{
element['on'+type]=hander;
}
}
}
var?mybtn=document.getElementById('mybtn')
eventFlow.addHander(mybtn,"click",function()?{
alert('hello');
});
</script>
</body>
</html>不起作用模式
HTML文檔
<!DOCTYPE?html> <html> <head> <meta?charset="UTF-8"> <title>事件流</title> <script?src='wrap.js'></script> </head> <body> <input?type="button"?value="按鈕"?id='mybtn'?/> </body> </html>
JS文檔
var?eventFlow={ //創建一個實例
addHander:function(element,type,hander){ //創建一個方法:addEvent用來添加事件
if(element.addEventListener){
element.addEventListener(type,hander,false);
}else?if(element.attachEvent){
element.attachEvent('on'+type,hander);
}else{
element['on'+type]=hander;
}
}
}
var?mybtn=document.getElementById('mybtn')
eventFlow.addHander(mybtn,"click",function()?{
alert('hello');
});當把這些JS代碼單獨寫在文件里引用時卻不起作用了,求高人指點
2016-09-29
瀏覽器渲染默認是從上往下順序進行的,因此第二種外鏈式引入,先將JS渲染,然后渲染HTML,因此不起作用,由此,可以推知,將JS在HTML后引入可以解決,或者在JS中寫上window.onload=function(){}將JS代碼放在里面就可以了。