Einfügen eines Tag mit JavaScript</h2> <p><strong>Frage:</strong></p> <p>Wie kann man einen <style> erstellen? taggen und mit JavaScript in eine HTML-Seite einfügen? Gibt es eine Methode, die eleganter und browserübergreifend kompatibler ist als die aktuelle Lösung, die innerHTML verwendet?</p> <p><strong>Antwort:</strong></p> <p>Der bevorzugte Ansatz besteht darin, das Stilelement anzuhängen direkt zum <Kopf> des Dokuments. Diese Methode funktioniert konsistent in allen gängigen Browsern, einschließlich Chrome. Hier ist eine verbesserte Lösung:</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">Nach dem Login kopieren</div></div> <p>Diese Methode bietet die folgenden Vorteile:</p> <ul> <li>Sie ist eleganter und prägnanter.</li> <li>Sie funktioniert in allen gängigen Browsern. einschließlich Chrome.</li> <li>Es vermeidet die Notwendigkeit eines zusätzlichen <br> Element vor dem Style-Tag, um browserübergreifende Probleme zu beheben.</li> </ul>
