javascript - 學(xué)習(xí)網(wǎng)頁開發(fā)，關(guān)于head區(qū)域一段腳本的疑惑
問題描述
自學(xué)前端不就，查看公司的主頁，在head區(qū)域有如下代碼：
<head>............<script>//疑惑1var _hmt = _hmt || []; //疑惑2(function() { ? var hm = document.createElement('script'); ? hm.src = 'https://hm.baidu.com/hm.js?788111edda8b56f4a6c2bdd403891d20'; ? //這個(gè)鏈接是百度的一些插件功能var s = document.getElementsByTagName('script')[0]; ? s.parentNode.insertBefore(hm, s); })();</script></head>
疑惑1：短路運(yùn)算法用在這里，后續(xù)是做什么用的？一般都這么做嗎？疑惑2：代碼的意思是在script前面動(dòng)態(tài)加<script src=’https://hm.baidu.com/hm.js?78...’>語句。可是為什么要這么做呢？我測(cè)試了下，直接在head里加上這段代碼實(shí)現(xiàn)的功能也一樣啊。如果是多頁面，我每個(gè)頁面加這段代碼字符數(shù)也比function里面的字符數(shù)少啊。。實(shí)在搞不懂？？請(qǐng)達(dá)人解惑，感謝！
問題解答
回答1：實(shí)現(xiàn)過一個(gè)類似的統(tǒng)計(jì)庫，簡(jiǎn)單分享下個(gè)人對(duì)這個(gè)機(jī)制的理解。
<script>// 這里如果已引入 _hmt 變量，則保留已有值// 僅在未初始化成功的情況下將其初始化// 避免后端模板拼接而成的頁面中多處引入百度統(tǒng)計(jì)時(shí)，重復(fù)初始化變量的問題var _hmt = _hmt || []; // 疑惑2(function() { var hm = document.createElement('script'); hm.src = 'https://hm.baidu.com/hm.js?788111edda8b56f4a6c2bdd403891d20';var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(hm, s); })();</script>
你的疑問在于，為什么不直接添加 hm.src 中的鏈接到 script 標(biāo)簽?zāi)_本中，而是先初始化 _hmt 變量后才添加該腳本。這應(yīng)當(dāng)是和統(tǒng)計(jì)庫的功能實(shí)現(xiàn)有關(guān)的。簡(jiǎn)要介紹：
_hmt 實(shí)質(zhì)是是一個(gè)消息隊(duì)列的緩存。插入該數(shù)組的內(nèi)容均是各類點(diǎn)擊、滑動(dòng)、觸摸等用戶事件。推入這個(gè)消息隊(duì)列中的事件會(huì)被統(tǒng)計(jì)庫上報(bào)到百度統(tǒng)計(jì)。
這個(gè)緩存是支持在第一方業(yè)務(wù)代碼中通過 JS API 來寫入的。例如使用百度統(tǒng)計(jì)的開發(fā)者，可以在自己的 JS 代碼中編寫形如 _hmt.push(xxx) 的邏輯，推送自定義的事件到消息隊(duì)列中。
由于第三方腳本同樣能寫入該消息隊(duì)列，這就要求該隊(duì)列的數(shù)組變量不僅必須全局，還必須盡早初始化。而統(tǒng)計(jì)庫的上報(bào)等業(yè)務(wù)邏輯則可以延遲到頁面主要內(nèi)容加載完成后再執(zhí)行。
為了實(shí)現(xiàn) 3 中的要求，統(tǒng)計(jì)腳本的引入方式才設(shè)計(jì)為【首先初始化一個(gè)數(shù)組，然后動(dòng)態(tài)加載統(tǒng)計(jì)腳本】。這樣加載隊(duì)列數(shù)組時(shí)直接在頁面中內(nèi)聯(lián)初始化非常高效，后面的統(tǒng)計(jì)腳本延遲加載，減小對(duì)頁面加載速度的影響。
回答2：疑惑二：這個(gè)應(yīng)該是百度統(tǒng)計(jì)吧。。。
回答3：說明1.是判斷是否已經(jīng)定義了_hmt變量,或者定義變量
2.動(dòng)態(tài)載入。節(jié)點(diǎn)操作載入的優(yōu)先級(jí) < 靜態(tài)資源.這樣是為了不影響渲染頁面
測(cè)試1.第一行你可以自行研究
2.第二行你可以對(duì)比2種載入效果。
回答4：這是一段百度統(tǒng)計(jì)的代碼，至于為什么“我單獨(dú)創(chuàng)建了一個(gè)頁面，只加了這個(gè)JS代碼，彈出的頁面內(nèi)容就咨詢窗口那些?！币?yàn)榭缬蛄酥劣谑裁词强缬蚓褪前褎e人家的東西拿到自己家用的方法
網(wǎng)公網(wǎng)安備