html文件載入順序簡單理解
阿新 • • 發佈：2018-12-09
html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="outUp1.js"></script> <script> alert("body上面的js！"); document.getElementsByTagName("div")[0].style.cssText= "background-color:red"; </script> <script src="outUp2.js"></script> <!--html文件按照從上往下的順序載入，他沒有找到div這個標籤名，所以樣式沒有被修改 想要讓上面引入的js檔案在文件載入完成之後執行的話就需要用window.onload函式， 這樣才不會出錯。--> </head> <body> <div color="green">初始測試div</div> </body> <script src="outUp3.js"></script> <script> alert("body下面的js！"); </script> <script src="outUp4.js"></script> </html>
outUp1.js
alert("body上面的外部資源js1！");
document.getElementsByTagName("div")[0].style.cssText = "background-color:aqua;";
outUp2.js
alert("body上面的外部資源js2！");
document.getElementsByTagName("div")[0].style.cssText = "color:black;";
outDown1.js
alert("body下面的外部資源js3！");
document.getElementsByTagName("div")[0].style.cssText = "background-color:blue;";
outDown2.js
alert("body下面的外部資源js4！");
document.getElementsByTagName("div")[0].style.cssText = "color:red;";