Javascript Girl
  1. Javascript Girl
  3. Comment obtenir un script de contenu à charger APRÈS le Javascript d'une page a été exécuté?
Intereting Posts
Comment résumer les valeurs des boutons radio en utilisant JavaScript ou jQuery? Pourquoi . Map (String.prototype.toLowerCase.call) fonctionnent-ils? Existe-t-il un objectif fonctionnel pour définir une variable sur «ceci»? Trouver toutes les règles CSS qui s'appliquent à un élément Localstorage: si l'ID d'un <li> existe dans l'alerte de stockage locale Comment puis-je réparer la barre de navigation bootstrap vers le haut après qu'un div a été défilé? Comment décider quand utiliser ngView ou ngInclude? Dans JavaScript, comment puis-je configurer rgba sans spécifier le rgb? IE e.target.id ne fonctionne pas Toile HTML5 – Traverser le texte sur le problème de la toile Une bonne bibliothèque JavaScript Text-to-Speech Empêchez le chargement de safari à partir du cache lorsque le bouton de retour est cliqué Ordre de sélection en html sélectionner plusieurs? Pourquoi ma page ne se charge-t-elle pas sur Github? Support JSON de navigateur-natif (window.JSON)

Comment obtenir un script de contenu à charger APRÈS le Javascript d'une page a été exécuté?

Mon extension est censée charger un script de contenu, searchTopic.js, seulement après que la page dans laquelle il a été injecté a déjà complètement chargé (oui, j'ai défini "run_at" sur "document_end" dans le manifeste d'extension), mais en fait il est en train de charger avant Tous les objets DOM ont été créés (les éléments essentiels sont créés via un certain Javascript sur la page). La question est donc de savoir comment puis-je attendre que le Javascript de la page soit exécuté? Voici mon manifeste: 

"content_scripts": [ { "run_at": "document_end", "matches": ["https://groups.google.com/forum/*"], "js": ["searchTopic.js"] } ],

"run_at": "document_end" équivaut à DOMContentLoaded . C'est-à-dire qu'il se déclenche après que le HTML statique est chargé, mais avant les images lentes et le javascript lent.

Ainsi, vous ne pouvez pas configurer un script de contenu pour déclencher après le JS de la page, simplement en définissant seul le manifeste. Vous devez coder pour cela dans le script de contenu lui-même.

Pour les scripts de contenu, "run_at": "document_end" déclenche avant l'événement onload (contrairement au document_idle par défaut – qui peut déclencher à des moments imprévisibles).

Ainsi, la première étape consiste à attendre l'événement de load avec un code comme celui-ci dans votre script de contenu ( searchTopic.js ): 

 window.addEventListener ("load", myMain, false); function myMain (evt) { // DO YOUR STUFF HERE. }

Dans le cas où le script dont vous vous souciez prend un certain temps pour terminer, vous devrez sondage pour une condition au cas par cas. Par exemple: 

 window.addEventListener ("load", myMain, false); function myMain (evt) { var jsInitChecktimer = setInterval (checkForJS_Finish, 111); function checkForJS_Finish () { if ( typeof SOME_GLOBAL_VAR != "undefined" || document.querySelector ("SOME_INDICATOR_NODE_css_SELECTOR") ) { clearInterval (jsInitChecktimer); // DO YOUR STUFF HERE. } } }

script éléments de script sont exécutés dans l'ordre. Le navigateur arrête même de charger le contenu DOM s'il existe des noeuds de script dans le body . Ceci est garanti pour fonctionner, sinon document.write() cesserait de fonctionner.

Donc vous avez deux solutions:

  1. Utilisez l'événement onload pour charger votre code.
  2. Ajoutez une étiquette de script comme dernier élément de la page (dernière chose dans l'élément du body ). Ce script sera exécuté après que tous les autres scripts auront terminé et après que le corps a été converti en un arbre DOM.

Vous utilisez la méthode window.load. 

 function addLoadEvent(a) { var b = window.onload; "function" != typeof window.onload ? window.onload = a : window.onload = function () { b && b(), a() } } function init() { alert('init'); } addLoadEvent(init);

Essayez d'ajouter une balise 'script' à la tête. Faites quelque chose comme ça: 

 jQuery(document).ready(function() { jQuery('head').append('<script type="text/javascript" src="yoursource.js" />'); });

Et dans le script ajouté, vous pouvez également utiliser 

 jQuery(document).ready(function() { [...] });