ajouter javascripts et les fichiers css dynamiquement au html en utilisant javascript

Je construis un widget javascript et j'ai besoin d'ajouter mes fichiers de widget css et js de façon dynamique à la page du client.ajouter javascripts et les fichiers css dynamiquement au html en utilisant javascript

Je fais cela pour l'instant:

var css = document.createElement('link'); 
    css.setAttribute('rel', 'stylesheet'); 
    css.setAttribute('href', 'css path'); 
    document.getElementById('test').appendChild(css); 
    alert(document.getElementById('test').innerHTML);

Mais il n'ajoute l'élément au dom. L'alerte s'affiche correctement.

Qu'est-ce qui me manque?

EDIT1:

Voici le code mis à jour: (notez que ce n'est une page de test).

<html> 
    <head> 

    </head> 
    <body> 
     <div id="test"> 
      test 
     </div> 

     <script type="text/javascript"> 


    var css = document.createElement('link'); 
    css.setAttribute('rel', 'stylesheet'); 
    css.setAttribute("type", "text/css"); 
    css.setAttribute('href', 'path'); 
    var header = document.getElementsByTagName("head")[0]; 
    header.appendChild(css); 
    alert(header.innerHTML); 

     </script> 
    </body> 
</html>

En-tête.InnerHtml semble correct mais rien n'est ajouté à la page.

Source

2010-10-07 brpaz

Vous définissez en fait '' href' à » css path "', ou configurez-vous le chemin d'accès réel à votre CSS? - Ajoutez également le CSS au ''. –

Le chemin est correct. J'ai collé l'url dans le navigateur et il montre mon fichier css. – brpaz

le chemin est correct, mais les autorisations sur le fichier css ont raison? Si vous insérez directement dans le document, le fichier est correctement analysé? –

avez-vous essayé d'ajouter le css dans la section < tête >?

var css = document.createElement('link'); 
    css.setAttribute('rel', 'stylesheet'); 
    css.setAttribute('href', 'css path'); 
    document.getElementsByTagName('head')[0].appendChild(css);

Source

2010-10-07 14:57:05

+1 - CSS doit être déclaré dans l'élément "head" du document. Il n'est pas valide de l'inclure ailleurs. – Fenton

Je pense que vous devez joindre à la de votre html, pas seulement le document:

var css = document.createElement('link'); 
css.setAttribute('rel', 'stylesheet'); 
css.setAttribute("type", "text/css"); 
css.setAttribute('href', 'css path'); 
var header = document.getElementsByTagName("head")[0]; 
header.appendChild(css);

Hope this helps :)

Source

2010-10-07 15:00:19 mrjames

Ça ne marche toujours pas. Le innerHTML de l'élément d'en-tête est correct mais rien n'est ajouté à la page. Je posterai le code mis à jour au premier post. – brpaz

ajouter javascripts et les fichiers css dynamiquement au html en utilisant javascript

Répondre

Questions connexes