探討JavaScript標(biāo)簽位置的存放與功能有無(wú)關(guān)系
在網(wǎng)頁(yè)中，我們可以將JavaScript代碼放在html文件中任何位置，但一般放在head或body標(biāo)簽里面。
一般來(lái)說(shuō)，<script>元素放在哪里與其的功能作用是緊密相關(guān)的，在這里討論2種情況：
1、放在<head>里
將<script>元素放在head中是為了讓瀏覽器在一開始就讀取，<script>元素會(huì)在整個(gè)網(wǎng)頁(yè)最開始解析時(shí)就加載執(zhí)行，其優(yōu)先次序僅次于<title>元素。
然后依次向下解析渲染。
應(yīng)用：比如進(jìn)行頁(yè)面顯示初始化的js必須放在head里面。
2、放在<body>部分
瀏覽器按照頁(yè)面標(biāo)簽順序依次解析，在讀取到JavaScript代碼時(shí)就會(huì)執(zhí)行語(yǔ)句。
但有的JS函數(shù)是通過(guò)事件調(diào)用的，所以具體放在頁(yè)面的哪個(gè)位置并不影響其發(fā)揮作用的時(shí)間，所以，在考慮到前端性能方面的問(wèn)題后，可以把不是最先執(zhí)行的和事件調(diào)用的JS代碼放在body的最下面。
寫一寫看咯：
<!DOCTYPE HTML>
<html>
<head>
<title>JS代碼的位置</title>
<script type="text/javascript">
document.write("I'M HEAD javascript");
</script>
</head>
<body>
<script type="text/javascript">
document.write("I'M body javascript");
</script>
</body>
</html>
由以上所述看出，javascript標(biāo)簽位置的存放與功能緊密相關(guān)，希望本文所述對(duì)大家有所幫助。
- javascript標(biāo)簽在頁(yè)面中的位置探討
- JS實(shí)現(xiàn)切換標(biāo)簽頁(yè)效果實(shí)例代碼
- Js實(shí)現(xiàn)當(dāng)前點(diǎn)擊a標(biāo)簽變色突出顯示其他a標(biāo)簽回復(fù)原色
- js監(jiān)聽滾動(dòng)條滾動(dòng)事件使得某個(gè)標(biāo)簽內(nèi)容始終位于同一位置
- 純css+js寫的一個(gè)簡(jiǎn)單的tab標(biāo)簽頁(yè)帶樣式
- 使用JS或jQuery模擬鼠標(biāo)點(diǎn)擊a標(biāo)簽事件代碼
- js實(shí)現(xiàn)a標(biāo)簽超鏈接提交form表單的方法
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)跑馬燈效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
JavaScript事件委托技術(shù)實(shí)例分析
這篇文章主要介紹了JavaScript事件委托技術(shù),實(shí)例分析了事件委托技術(shù)的原理、適用場(chǎng)合及用法實(shí)例,需要的朋友可以參考下2015-02-02
JavaScript進(jìn)階（一）變量聲明提升實(shí)例分析
這篇文章主要介紹了JavaScript變量聲明提升,結(jié)合實(shí)例形式分析了JavaScript變量聲明提升相關(guān)原理、用法與操作注意事項(xiàng),需要的朋友可以參考下2020-05-05
如何編寫一個(gè) Webpack Loader的實(shí)現(xiàn)
這篇文章主要介紹了如何編寫一個(gè) Webpack Loader的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-10-10
JavaScript中undefined、null與NaN的區(qū)別
undefined、null和NaN都屬于javascript中的數(shù)據(jù)類型,本文主要介紹了 JavaScript中undefined、null與NaN的區(qū)別,具有一定的參考價(jià)值,感興趣的可以了解一下2023-09-09
下面小編就為大家?guī)?lái)一篇js獲取新浪天氣接口的實(shí)現(xiàn)代碼。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-06-06
js提交form表單,并傳遞參數(shù)的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇js提交form表單,并傳遞參數(shù)的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
下面小編就為大家分享一篇基于Vue的ajax公共方法(詳解)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-01-01
JavaScript錯(cuò)誤處理try..catch...finally+涵蓋throw+TypeError+RangeEr
這篇文章主要介紹了JavaScript錯(cuò)誤處理:try..catch...finally+涵蓋throw+TypeError+RangeError,文章內(nèi)容具有一定的參考價(jià)值，需要的小伙伴可以參考一下，希望對(duì)你有所幫助2021-12-12
這篇文章主要為大家詳細(xì)介紹了js css自定義分頁(yè)效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-02-02