defer属性是在告诉浏览器要等整个页面载入之后,解析完毕才执行该<script…/>元素的脚本
- 没有defer的时候
<! DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js执行时机</title>
<script src="js/3.js" type="text/javascript" >
</script>
</head>
<body >
<div id="target"></div>
</body>
js文件代码
var tg= document.getElementById("target");
tg.innerHTML = "sdjfls";
tg.style.backgroundColor = "#aab";
浏览器错误提示
- 加入defer后
不在报错,正常显示出css中的样式
<script src="js/3.js" type="text/javascript" defer>
defer属性会告诉浏览器必须等整个界面载入之后,解析完毕才执行该<script…/>元素中的脚本,因此只要加入defer即可