1. 程式人生 > >今天仔細學習了html載入執行的順序

今天仔細學習了html載入執行的順序

頁面上通常會有三個標籤,html,head,body,這三個之間的關係是,html包含整個頁面程式碼,head主要用於引入一些js,css檔案,body用來包含頁面程式碼和js程式碼

瀏覽器載入頁面的順序為,先載入head,如果碰到script標籤的話,會判斷是引入外部js檔案還是js程式碼,如果是檔案會開始下載外部檔案,如果是程式碼則html頁面載入會暫停,此時javascript引擎開始執行程式碼,等程式碼執行完了繼續載入頁面,等head標籤裡面的內容都載入完了之後 開始載入body標籤的內容,如果body裡面遇到script標籤的話,是檔案就下載,是程式碼又會暫停載入頁面,轉而讓引擎執行js程式碼,等js程式碼執行完畢之後才會繼續載入頁面這種。

我今天就遇到這種情況,我把js程式碼寫在了head標籤裡面,js頁面有操作table表格的程式碼,但是一直都取不到表格的元素,原因就是因為head裡面的js程式碼執行的時候,頁面還沒有載入完成,表格也沒有加載出來,導致今天的問題。

一般的作法是把有js程式碼的script標籤放在body的靠後位置,或者要是為了body裡面結構比較清晰,也可以放在head裡面,但是js程式碼放在window.onload事件裡面,這樣也可以