Safari et Chrome n'évaluent pas dynamiquement ajouté <script> tag au chargement de la page

J'écris un petit code JavaScript qui va charger les fichiers js externes au chargement de la page html.Safari et Chrome n'évaluent pas dynamiquement ajouté <script> tag au chargement de la page

J'ai testé 2 façons.

Cas 1: Utilisé document.write pour ajouter <script>. Cela a fonctionné pour tous les navigateurs (IE, FF, Safari, Chrome, Opera).

Cas n ° 2: Utilisé DOMElement.appendChild ajouter < scénario > tag au < Haed élément >.

Fonctionne uniquement pour IE, FF et Opera. N'a pas fonctionné pour Safari et Chrome.

Dans les deux cas, je m'attendais à nouveau <script> tag est en cours d'insertion avant < tête > étiquette de fermeture. Donc le nouveau tag < > est évalué avant de traiter < le corps >, et au moment où window.onload est appelé, la variable "success" doit être vraie.

Mais ce n'était pas pour Safari et Chrome.

Quelqu'un peut-il dire si cela devrait ou ne devrait pas fonctionner? Je vous remercie.

<html> 
    <head> 
    <title>JavaScript loading test</title> 
    <script type="text/javascript"> 
     var success = false; 

     window.onload = function() 
     { 
     document.getElementById("result").innerHTML = success? "OK": "ERROR!"; 
     } 

     // TEST CASE 1. 
     // Works for all browsers. 
     document.write('<script type="text/javascript" src="foo.js"></' + 'script>'); 

     // TEST CASE 2. 
     // Only works for Opera, FireFox, Opera. 
     // var scriptElem = document.createElement("script"); 
     // scriptElem.setAttribute("type", "text/javascript"); 
     // scriptElem.setAttribute("src", "foo.js"); 
     // var headElem = document.getElementsByTagName("head")[0]; 
     // headElem.appendChild(scriptElem); 
    </script> 
    <!-- expected new scrip tag being inserted here. --> 
    </head> 
    <body> 
    Testing...<br/> 
    <span id="result"></span> 
    </body> 
</html>

"foo.js" est juste une ligne de code.

success = true;

Source

2010-02-06 3rensho

Juste un commentaire - en modifiant votre exemple un peu, j'ai réussi à obtenir un comportement différent Opera, Firefox, Safari et Safari tout en traversant le code. –

Incidemment, ''...' est toujours invalide. La manière la plus simple de protéger un littéral de chaîne d'étiquette de fin à l'intérieur d'un bloc de script est '<\/script'. – bobince

avez-vous déjà trouvé une solution à ce problème? – Fabii

Au moment où votre javascript est évalué, le DOM n'est pas entièrement construit, l'élément de tête est même pas terminé. Vous ne pouvez normalement pas accéder ou manipuler le DOM (getElementsByTagName et appendChild, etc.) avant que la page HTML soit entièrement chargée.

Source

2010-02-06 09:23:22 Leventix

Vous pouvez accéder au DOM avant le chargement de la page, mais vous ne pouvez pas accéder aux éléments sous le bloc de script actuel, et il est très peu fiable de faire des manipulations comme des insertions dans des éléments dont la balise close n'a pas encore été rencontrée. – bobince

Essayez ceci:

var s = document.createElement('SCRIPT'); 
s.charset = 'UTF-8'; 
s.src ='foo.js'; 
document.getElementsByTagName('HEAD')[0].appendChild(s);

Mais placer dans une balise SCRIPT au début de la balise BODY

Source

2010-02-06 11:43:35 Mic

Merci Mic. Mais Safari et Chrome montrent toujours la même erreur ... – 3rensho

Safari et Chrome n'évaluent pas dynamiquement ajouté <script> tag au chargement de la page

Répondre

Questions connexes