Insérer un Tag avec JavaScript</h2> <p><strong>Question :</strong></p> <p>Comment créer un <style> baliser et l'insérer dans une page HTML à l'aide de JavaScript ? Existe-t-il une méthode plus élégante et compatible avec tous les navigateurs que la solution actuelle qui utilise innerHTML ?</p> <p><strong>Réponse :</strong></p> <p>L'approche préférée consiste à ajouter l'élément de style directement à la <tête> du document. Cette méthode fonctionne de manière cohérente sur les principaux navigateurs, y compris Chrome. Voici une solution améliorée :</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>var css = 'h1 { background: red; }', head = document.head || document.getElementsByTagName('head')[0], style = document.createElement('style'); head.appendChild(style); style.type = 'text/css'; if (style.styleSheet) { // This is required for IE8 and below. style.styleSheet.cssText = css; } else { style.appendChild(document.createTextNode(css)); }</pre><div class="contentsignin">Copier après la connexion</div></div> <p>Cette méthode offre les avantages suivants :</p> <ul> <li>Elle est plus élégante et concise.</li> <li>Elle fonctionne dans tous les principaux navigateurs, y compris Chrome.</li> <li>Cela évite d'avoir besoin d'un <br> élément devant la balise de style pour résoudre les problèmes entre navigateurs.</li> </ul>
