Implementierung neuer Tags mit HTML5 in alten Browsern wie IE6 series

Implementierung neuer Tags mit HTML5 in alten Browsern wie IE6 series_html5 Tutorial-Tipps

WBOY

Freigeben： 2016-05-16 15:50:31

Original

1421 Leute haben es durchsucht

HTML5 bietet Entwicklern viele neue Tags, wie Abschnitt, Navigation, Artikel, Kopf- und Fußzeile usw. Diese Tags sind sehr semantisch und werden häufig verwendet, aber in altmodischen Tags wie IE6, IE7, IE8 und Firefox 2 Es kann im Browser nicht normal erkannt und verwendet werden.

Warum erkennen ältere Browser diese Tags nicht?

Tatsächlich liegt der Fehler nicht beim Browser, da solche Tags zu diesem Zeitpunkt noch nicht existierten und daher nicht korrekt erkannt werden konnten, und diese ungewöhnliche Tag-Erkennung führte zu einer abnormalen DOM-Struktur.

Wir haben den Testcode wie folgt. Es handelt sich um einen Artikeltitel und einen Artikelinhalt in blauen Worten, wobei der Artikelinhalt das Artikel-Tag verwendet.

Code kopieren

Der Code lautet wie folgt:

<head>

Test
Artikel{color:#06F;}

<article>
Dies ist der Inhalt des Artikels, es sollte ein blauer Text sein. Wenn Sie in älteren Browsern keinen Hack durchführen, wird eine Ausnahme angezeigt.

In IE8 wird es wie folgt angezeigt.

IE8 kann das Artikel-Tag nicht erkennen und der für das Tag definierte CSS-Stil hat keine Auswirkung. In IE8 wird <article> als zwei leere Tag-Elemente mit den Namen <article /> und </article /> interpretiert, die dem Artikel gegenübergestellt werden Inhalt. Es handelt sich um einen Geschwisterknoten, wie unten gezeigt.

Wie verwende ich HTML5-Tags in älteren Browsern? Da

nicht verwendet werden kann, weil das Tag nicht erkannt werden kann, besteht die Lösung darin, das Tag erkennen zu lassen. Glücklicherweise können Sie durch die einfache Verwendung von document.createElement(tagName) den Browser das Tag erkennen lassen und die CSS-Engine über die Existenz des Tags informieren . Nehmen Sie unser obiges Beispiel an. Fügen Sie den folgenden Code zum Bereich <head> ><script><br> document.createElement('article');<br></script>

hinzu Die DOM-Interpretation in IE8 sieht wie folgt aus.

Selbstverständlich wird der Text auch in normalem Blau angezeigt.

Fazit

Der Blog wurde schon lange auf HTML5 umgestellt, aber da viele Benutzer nicht die neuesten Browser verwenden, verwenden sie immer noch den HTML4-Tag-Satz. Viele HTML5-Tags sind semantisch und praktisch, und ich habe auch begonnen, einige häufig verwendete zu testen Tags. , jetzt mit Artikel- und Zeit-Tags.