js和css的順序關係

2021-09-26 14:00:33 字數 859 閱讀 2087

1. head裡的順序如下,考慮會對請求有何影響:

a. 外部js在css前面

b. 外部js在css後面

c. 內部js在css後面

d. 內部js在css前面

e. 內聯css在外聯css前面

f. 內聯css在外聯css後面

結果: 

a,b – head裡出現外聯js,無論如何放,css檔案都不能和body裡的請求並行 (圖1) 

c – head裡的內聯js只要在所有外聯css前面,css檔案可以和body裡的請求並行(圖2) 

d – head裡的內聯js只要在任一外聯css後面,css檔案就不能和body裡的請求並行(圖1) 

e – firefox/ie下,要等1.css載入完生效。safari/chrome下,則先生效,再載入1.css 

f – 等1.css載入完生效

2. 內聯js要等它前面的所有外聯css檔案載入完後執行。之前寫過一篇 子資源原理的筆記。

3. 外聯js放在頁面最後,高階瀏覽器會自動做優化。如:

firefox/chrome/safari載入的優化處理相似。見圖3。

4. 內聯長執行時間js,無論放在頁面任何位置,都會影響整個頁面的渲染。 測試檔案,如:

button
在頁面初始執行階段如果有長執行時間的內聯js,對效能的影響是非常非常嚴重的!但是,如果把那段執行5s的js放到外部就不會有上述影響,或者移到domreay/onload後執行也可以。

依據上述結論組織頁面中的css和js才會更合理。

js和css的順序關係及js載入執行優化探索

1.head裡的順序如下,考慮會對請求有何影響 a.外部js在css前面 b.外部js在css後面 c.內部js在css前面 d.內部js在css後面 e.內聯css在外聯css前面 f.內聯css在外聯css後面 結果 a,b head裡出現外聯js,無論如何放,css檔案都不能和body裡的請求...

jq和js的關係 JS和JQUERY的區別

根據id取元素 js 取到的是乙個dom物件。例 var div document.getelementbyid one jquery 取到的是乙個jquery物件。例 var div one 括號裡面是根據某個東西來找,相當於乙個選擇,如果我們要根據id來找,在樣式表裡的id是用 來表示的,所以在...

js 執行緒和程序的關係

程序 process 和執行緒 thread 是作業系統的基本概念 1.計算機的核心是cpu,它承擔了所有的計算任務 2.單個cpu一次只能執行乙個任務 3.程序它代表cpu所能處理的單個任務。任一時刻,cpu總是執行乙個程序,其他程序處於非執行狀態 4.乙個程序可以包括多個執行緒。5.乙個程序的記...