JavaScript_笔记2 script元素的位置

script元素放在< head >中

<!DOCTYPE html>
<html>
	<head>
		<title>the location of 'script' is here</title>
		<script src='demo.js'></script>
		<script src='demo1.js'></script>
		<script src='demo2.js'></script>
		<script src='demo3.js'></script>
	</head>
	<body>
	 	<!-- 页面的内容 -->
	</body>
</html>

如上代码段,将script元素放在head元素中。这种做法意味着:等到所有JavaScript代码都被下载、解析和执行完成后,才能呈现页面的内容(body标签)。
如果有许多JS代码需要下载、解析和执行,那打开浏览器将会出现一段时间的空白。
故现代Web应用会将script元素放在body元素页面内容的后面。

script元素放在body元素内容的后面

<!DOCTYPE html>
<html>
	<head>
		<title>the location of 'script' is not here</title>
	</head>
	<body>
		<!-- 页面的内容 script元素放在这之后-->
		<!-- 这样就不会因为等待处理JS代码,而长时间看着空白的页面-->
		<script type='text/javascript' src='demo.js'></script>
		<script type='text/javascript' src='demo1.js'></script>
	</body>
</html>

把script元素放在body页面内容的后面,用户在打开浏览器时,不会像之前一样要长时间等待空白页面。

猜你喜欢

转载自blog.csdn.net/qq_43263320/article/details/112669656
今日推荐