Js放到HTML文件中的哪个位置有什么区别

JavaScript017

Js放到HTML文件中的哪个位置有什么区别,第1张

如果js里有在页面编译前要自动调用的方法则需要放在头部。如果js里有,需要页面加载结束后自动调用页面中的元素则需要放在尾部。如果js里的方法都是通过点击页面中的元素才调用的放在。放在头尾都可以。一般放在头部。

如果使用window.onload函数,将js代码放在其中,则放在哪里都是一样的,因为都是在body加载完再执行的

如果不使用window.onload函数,放在head中的话,代码不会被执行,这是因为html执行顺序,确切的说是js的执行顺序

HTML从上运行到<script type="text/html" src="test.js"></script>的时候进入test.js文件。前面的不会运行,也就是被function包起来的不会被运行,这个时候就执行最后一句。去页面中取元素。但是这个时候,HTML页面并没有加载完。所以找不到元素,就会报错。

代码:

<html> 

<head> 

<title> New Document </title> 

<meta http-equiv="content-type" content="text/htmlcharset=utf-8"> 

<script type="text/javascript" src="test.js"></script> 

</head> 

<body> 

<div id="target"> 

</div> 

<button id="btn">按钮</button> 

</body> 

</html>

test.js代码:

var test = function(){ 

var span = document.createElement("span") 

span.innerHTML="添加" 

document.getElementById("target").appendChild(span) 

document.getElementById("btn").onclick=test