js的script標(biāo)簽到底是放在head還是body中盼忌?

本文收集并整理了一些網(wǎng)上的回答,在此就不便每一個(gè)都給鏈接了掂墓。

js可以分為外部的和內(nèi)部的谦纱。
外部的js一般放到head內(nèi)

內(nèi)部的js

內(nèi)部的js也叫本頁(yè)面的JS腳本,
內(nèi)部的js一般放到body內(nèi)君编,這樣做的目的有很多跨嘉,

  1. 不阻塞頁(yè)面的加載(事實(shí)上js會(huì)被緩存);
  2. 可以直接在js里操作dom吃嘿,這時(shí)候dom是準(zhǔn)備好的祠乃,即保證js運(yùn)行時(shí)dom是存在的。
  3. '貓頭鷹書'建議的方式是放在頁(yè)面底部兑燥,監(jiān)聽window.onload 或 readystate 來(lái)觸發(fā)js

延伸:

head內(nèi)的js會(huì)阻塞頁(yè)面的傳輸和頁(yè)面的渲染亮瓷。

head 內(nèi)的 JavaScript 需要執(zhí)行結(jié)束才開始渲染 body,所以盡量不要將 JS 文件放在 head 內(nèi)降瞳≈鲋В可以選擇在 document 完成時(shí),或者特定區(qū)塊后引入和執(zhí)行 JavaScript挣饥。

而 CSS 應(yīng)當(dāng)寫在 head 中除师,以避免頁(yè)面元素由于樣式缺失造成瞬間的白頁(yè)或者給用戶閃爍感。 ---吳釗


所以在head內(nèi)的js一般要先執(zhí)行完后扔枫,才開始渲染body頁(yè)面汛聚。為了避免head引入的js腳本阻塞流浪器中主解析引擎對(duì)dom的解析工作,對(duì)dom的渲染短荐,一般原則是倚舀,樣式在前面叹哭,dom文檔,腳本在最后面痕貌。遵循先解析再渲染再執(zhí)行script這個(gè)順序话速。 ---知乎用戶

PS: 若你覺得可以、還行芯侥、過得去泊交、甚至不太差的話,可以“關(guān)注”一下柱查,就此謝過!

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末廓俭,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子唉工,更是在濱河造成了極大的恐慌研乒,老刑警劉巖,帶你破解...
    沈念sama閱讀 210,978評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件淋硝,死亡現(xiàn)場(chǎng)離奇詭異雹熬,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)谣膳,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,954評(píng)論 2 384
  • 文/潘曉璐 我一進(jìn)店門竿报,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人继谚,你說(shuō)我怎么就攤上這事烈菌。” “怎么了花履?”我有些...
    開封第一講書人閱讀 156,623評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵芽世,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我诡壁,道長(zhǎng)济瓢,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,324評(píng)論 1 282
  • 正文 為了忘掉前任妹卿,我火速辦了婚禮旺矾,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘纽帖。我一直安慰自己宠漩,他們只是感情好举反,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,390評(píng)論 5 384
  • 文/花漫 我一把揭開白布懊直。 她就那樣靜靜地躺著,像睡著了一般火鼻。 火紅的嫁衣襯著肌膚如雪室囊。 梳的紋絲不亂的頭發(fā)上雕崩,一...
    開封第一講書人閱讀 49,741評(píng)論 1 289
  • 那天,我揣著相機(jī)與錄音融撞,去河邊找鬼盼铁。 笑死,一個(gè)胖子當(dāng)著我的面吹牛尝偎,可吹牛的內(nèi)容都是我干的饶火。 我是一名探鬼主播,決...
    沈念sama閱讀 38,892評(píng)論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼致扯,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼肤寝!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起抖僵,我...
    開封第一講書人閱讀 37,655評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤鲤看,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后耍群,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體义桂,經(jīng)...
    沈念sama閱讀 44,104評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,451評(píng)論 2 325
  • 正文 我和宋清朗相戀三年蹈垢,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了慷吊。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,569評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡曹抬,死狀恐怖罢浇,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情沐祷,我是刑警寧澤嚷闭,帶...
    沈念sama閱讀 34,254評(píng)論 4 328
  • 正文 年R本政府宣布,位于F島的核電站赖临,受9級(jí)特大地震影響胞锰,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜兢榨,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,834評(píng)論 3 312
  • 文/蒙蒙 一嗅榕、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧吵聪,春花似錦凌那、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,725評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至块攒,卻和暖如春励稳,著一層夾襖步出監(jiān)牢的瞬間佃乘,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,950評(píng)論 1 264
  • 我被黑心中介騙來(lái)泰國(guó)打工驹尼, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留趣避,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,260評(píng)論 2 360
  • 正文 我出身青樓新翎,卻偏偏與公主長(zhǎng)得像程帕,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子地啰,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,446評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容

  • 簡(jiǎn)介瀏覽器可以被認(rèn)為是使用最廣泛的軟件髓绽,本文將介紹瀏覽器的工 作原理敛苇,我們將看到,從你在地址欄輸入google.c...
    聽風(fēng)閣閱讀 3,276評(píng)論 0 7
  • 轉(zhuǎn)載說(shuō)明 一顺呕、介紹 瀏覽器可以被認(rèn)為是使用最廣泛的軟件枫攀,本文將介紹瀏覽器的工作原理,我們將看到株茶,從你在地址欄輸入g...
    17碎那年閱讀 2,442評(píng)論 0 22
  • 目錄一来涨、介紹二、渲染引擎三启盛、解析與DOM樹構(gòu)建四蹦掐、渲染樹構(gòu)建五、布局六僵闯、繪制七卧抗、動(dòng)態(tài)變化八、渲染引擎的線程九鳖粟、CS...
    饑人谷_米彌輪閱讀 2,454評(píng)論 0 10
  • 1. 介紹 瀏覽器可能是最廣泛使用的軟件社裆。本書將介紹瀏覽器的工作原理。我們將看到向图,當(dāng)你在地址欄中輸入google....
    康斌閱讀 2,013評(píng)論 7 18
  • 1. CSS和JS在網(wǎng)頁(yè)中的放置順序是怎樣的泳秀? css放在head標(biāo)簽內(nèi),防止渲染時(shí)出現(xiàn)白屏 js放在最后body...
    billa_8f6b閱讀 568評(píng)論 0 0