Heim  >  Fragen und Antworten  >  Hauptteil

Javascript - Webentwicklung lernen, Zweifel an einem Skript im Kopfbereich

Wenn Sie nicht gut darin sind, Frontend selbst zu erlernen, schauen Sie auf der Homepage des Unternehmens nach. Dort finden Sie im Kopfbereich den folgenden Code:

<head>
......
......
<script>
//疑惑1
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>
</head>

Zweifel 1: Hier wird der Kurzschlussalgorithmus verwendet, wofür wird er später verwendet? Wird das generell gemacht?
Zweifel 2: Der Code bedeutet, die Anweisung <script src='https://hm.baidu.com/hm.js?78...'> dynamisch hinzuzufügen. Aber warum tun Sie das? Ich habe es getestet und diesen Code direkt in den Kopf eingefügt, um die gleiche Funktion zu erreichen. Wenn mehrere Seiten vorhanden sind, ist die Anzahl der Zeichen, die ich jeder Seite dieses Codes hinzufüge, geringer als die Anzahl der Zeichen in der Funktion. . Wirklich nicht verstehen? ?
Bitte bitten Sie einen Experten, meine Zweifel zu klären, vielen Dank!

漂亮男人漂亮男人2680 Tage vor591

Antworte allen(4)Ich werde antworten

  • 大家讲道理

    大家讲道理2017-05-24 11:38:19

    实现过一个类似的统计库,简单分享下个人对这个机制的理解。

    <script>
    // 这里如果已引入 _hmt 变量,则保留已有值
    // 仅在未初始化成功的情况下将其初始化
    // 避免后端模板拼接而成的页面中多处引入百度统计时,重复初始化变量的问题
    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 标签脚本中,而是先初始化 _hmt 变量后才添加该脚本。这应当是和统计库的功能实现有关的。简要介绍:

    1. _hmt 实质是是一个消息队列的缓存。插入该数组的内容均是各类点击、滑动、触摸等用户事件。推入这个消息队列中的事件会被统计库上报到百度统计。

    2. 这个缓存是支持在第一方业务代码中通过 JS API 来写入的。例如使用百度统计的开发者,可以在自己的 JS 代码中编写形如 _hmt.push(xxx) 的逻辑,推送自定义的事件到消息队列中。

    3. 由于第三方脚本同样能写入该消息队列,这就要求该队列的数组变量不仅必须全局,还必须尽早初始化。而统计库的上报等业务逻辑则可以延迟到页面主要内容加载完成后再执行。

    4. 为了实现 3 中的要求,统计脚本的引入方式才设计为【首先初始化一个数组,然后动态加载统计脚本】。这样加载队列数组时直接在页面中内联初始化非常高效,后面的统计脚本延迟加载,减小对页面加载速度的影响。

    Antwort
    0
  • 给我你的怀抱

    给我你的怀抱2017-05-24 11:38:19

    疑惑二:这个应该是百度统计吧。。。

    Antwort
    0
  • 黄舟

    黄舟2017-05-24 11:38:19

    说明

    1.是判断是否已经定义了_hmt变量,或者定义变量

    2.动态载入。节点操作载入的优先级 < 静态资源.这样是为了不影响渲染页面

    测试

    1.第一行你可以自行研究

    2.第二行你可以对比2种载入效果。

    Antwort
    0
  • PHP中文网

    PHP中文网2017-05-24 11:38:19

    这是一段百度统计的代码,
    至于为什么
    “我单独创建了一个页面,只加了这个JS代码,弹出的页面内容就咨询窗口那些。”
    因为跨域了
    至于什么是跨域
    就是把别人家的东西拿到自己家用的方法

    Antwort
    0
  • StornierenAntwort