简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - Apprentissage du développement Web, doutes sur un script dans la zone d'en-tête
漂亮男人
漂亮男人 2017-05-24 11:36:19
0
4
585

Si vous n'êtes pas doué pour apprendre le front-end par vous-même, consultez la page d'accueil de l'entreprise et il y a le code suivant dans la zone d'en-tête : 

<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>

Doute 1 : L'algorithme de court-circuit est utilisé ici, à quoi sert-il plus tard ? Est-ce généralement fait ?
Doute 2 : Le code signifie ajouter dynamiquement l'instruction <script src='https://hm.baidu.com/hm.js?78...'> Mais pourquoi faire ça ? Je l'ai testé et ajouté ce code directement dans la tête pour obtenir la même fonction. S'il y a plusieurs pages, le nombre de caractères que j'ajoute à chaque page de ce code sera inférieur au nombre de caractères de la fonction. . Vous ne comprenez vraiment pas ? ?
Veuillez demander à un expert de clarifier mes doutes, merci !

漂亮男人
漂亮男人

répondre à tous(4)
大家讲道理
大家讲道理2017-05-24 11:38:19 4 plancher

J'ai implémenté une bibliothèque statistique similaire et j'aimerais partager brièvement ma compréhension personnelle de ce mécanisme. 

<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>

Votre question est la suivante : pourquoi ne pas ajouter directement le lien dans hm.src au script de balise de script, mais initialiser d'abord la variable _hmt, puis ajouter le script. Cela devrait être lié à la mise en œuvre des fonctions de la bibliothèque statistique. Brève introduction : hm.src 中的链接到 script 标签脚本中，而是先初始化 _hmt 变量后才添加该脚本。这应当是和统计库的功能实现有关的。简要介绍：

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

  2. 这个缓存是支持在第一方业务代码中通过 JS API 来写入的。例如使用百度统计的开发者，可以在自己的 JS 代码中编写形如 _hmt.push(xxx)

    3. _hmt est essentiellement un cache de file d'attente de messages. Le contenu inséré dans ce tableau est tous types d'événements utilisateur tels que des clics, des diapositives, des touches, etc. Les événements placés dans cette file d'attente de messages seront signalés à Baidu Statistics par la bibliothèque de statistiques.

    4. Ce cache prend en charge l'écriture via l'API JS dans le code métier propriétaire. Par exemple, les développeurs qui utilisent Baidu Statistics peuvent écrire une logique sous la forme de _hmt.push(xxx) dans leur propre code JS pour envoyer des événements personnalisés vers la file d'attente de messages.

    5. Étant donné que les scripts tiers peuvent également écrire dans la file d'attente des messages, cela nécessite que les variables du tableau de la file d'attente soient non seulement globales, mais doivent également être initialisées le plus tôt possible. La logique métier telle que la création de rapports à la bibliothèque statistique peut être retardée jusqu'à ce que le contenu principal de la page soit chargé avant l'exécution.
🎜 🎜🎜Afin de répondre aux exigences du point 3, la méthode d'introduction du script statistique est conçue comme [initialiser d'abord un tableau, puis charger dynamiquement le script statistique]. De cette façon, l'initialisation en ligne directement dans la page lors du chargement du tableau de files d'attente est très efficace, et le chargement du script de statistiques ultérieur est retardé, réduisant ainsi l'impact sur la vitesse de chargement de la page. 🎜🎜 🎜
Comme +0
Ajouter une réponse
给我你的怀抱
给我你的怀抱2017-05-24 11:38:19 3 plancher

Doute 2 : Cela devrait être les statistiques de Baidu. . .

Comme +0
Ajouter une réponse
黄舟
黄舟2017-05-24 11:38:19 2 plancher

Instructions

1. Déterminez si la variable _hmt a été définie, ou définissez la variable

2. Chargement dynamique. La priorité du fonctionnement du nœud chargeant les ressources statiques < Ceci afin de ne pas affecter la page de rendu

.

Test

1. Vous pouvez étudier la première ligne par vous-même

2. Dans la deuxième ligne, vous pouvez comparer les deux effets de chargement.

Comme +0
Ajouter une réponse
Ty80
Ty802017-05-24 11:38:19 1 plancher

Il s'agit d'un morceau de code des statistiques de Baidu.
Quant à savoir pourquoi
"J'ai créé une page séparée et j'ai seulement ajouté ce code JS. Le contenu de la page qui apparaît est celui de la fenêtre de consultation."
Parce que c'est le cas. cross-domain
Quant à ce qu’est le cross-domain
C’est un moyen d’emporter les affaires des autres chez soi

Comme +0
Ajouter une réponse
Sujets populaires
Plus>
Articles populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！