放在HTML里的哪一部分Javascript会在页面加载时被执行()
A.文件头部位置
B.文件尾
C.<head>标签部分
D.<body>标签部分
答案:D
用JavaScript编写的代码必须通过HTML/XHTML文档才能执行。有两种方式可以做到这点。
第一种方式是将JavaScript代码放到文档<head>标签中的<script>标签之间:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>example</title>
<script>
JavaScript goes here...
</script>
</head>
<body>
Mark-up goes here...
</body>
</html>
一种更好的方式是把JavaScript代码存为一个扩展名为.js的独立文件。典型的做法是在文档的<head>
部分放一个<scrpt>标签,并把它的src属性指向该文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Example</title>
<script src="file.js"></script>
</head>
<body>
Mark-up goes here...
</body>
</html>
但最好的做法是把<script> 标签放到HTML文档的最后,<body> 标签之前;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Example</title>
</head>
<body>
Mark-up goes here...
<script src="file.js"></script>
</body>
</html>
浏览器对html页面内容的加载是顺序加载,也就是在html页面中前面先加载。当浏览器加载html文件并解析到<head>时,<body>并没有被解析,浏览器会等到<head>中的js部分执行完再加载页面。
例如,页面中的js脚本在head中,js脚本要读取的input在body中。因此当加载到js脚本时,input还没有加载到浏览器中。js是一种解释性的脚本,也是从上而下顺序执行,由于这段js代码是立即执行的,所以当JS在执行的时候,读取不到input的值。
在js执行完成前,后续所有资源的下载可能是没有必要的,这是js阻塞后续资源下载的根本原因。
所以处于<body>和</body>中的元素是在页面加载的时候被执行的。