So erkennen Sie, dass Versionen unter IE9 (IE6/7/8) HTML5-Elemente_HTML5-Tutorial-Fähigkeiten erkennen

Jeder Browser verfügt über eine Liste der unterstützten HTML-Elemente. Elemente, die nicht in der Liste enthalten sind, werden als unbekannte Elemente betrachtet. Der Browser legt keine Stile für unbekannte Elemente fest (verschiedene Browser haben unterschiedliche Standardstile für Elemente). In Versionen vor IE9 können unbekannte Elemente nicht formatiert werden. Das DOM unbekannter Elemente wird ebenfalls falsch angezeigt und der IE fügt einen leeren Knoten ohne untergeordnete Elemente in das DOM ein. Alle Elemente, von denen Sie gedacht hätten, dass sie Kinder dieses unbekannten Elements wären, werden zu seinen Geschwistern.

Es gibt eine Lösung für dieses Problem. Verwenden Sie js, um ein gefälschtes Artikelelement zu erstellen, bevor der IE dieses Element erkennt und das Festlegen von Stilen mit CSS unterstützt. Dieses gefälschte Element muss nicht einmal in das DOM eingefügt werden.

Bitte sehen Sie sich das folgende Beispiel an:

Kopieren Sie den Code

Der Code lautet wie folgt :

willkommen im Blog von feimos

> ;

Dies ist das erste Mal, dass Sie diese Website besuchen.

html>

IE6 erkennt den Artikel nicht, daher gibt es keinen roten Rand.

Aber wenn wir im Kopf einen js-Satz hinzufügen, wird die Situation sofort anders sein.

Code kopieren

Der Code lautet wie folgt:

IE6 gibt vor, dieses Element zu erkennen und den Effekt korrekt anzuzeigen.

Wir können einmalig eine gefälschte Kopie aller neuen HTML5-Elemente erstellen, sodass wir uns in Zukunft keine Sorgen mehr über Browser machen müssen, die HTML5 nicht gut unterstützen. Das HTML5-Aktivierungsskript von Remy Sharp hilft uns dabei. Die Grundidee des Skripts ist wie folgt:

Kopieren Sie den Code

Der Code lautet wie folgt:

Verwenden Sie zunächst bedingte Kommentare, um festzustellen, ob es sich um eine Version vor IE9 handelt, und wenn ja, führen Sie js aus. Schreiben Sie zunächst alle neuen Tags in das e-Array, durchlaufen Sie dann das gesamte Array und erstellen Sie eine Kopie.

Dieses Skript wurde auf Google Project Hosting gehostet. Sie können direkt auf dieses Skript verlinken:

Kopieren Sie den Code

Der Code lautet wie folgt:

Außerdem muss dieses Skript vorzugsweise am Anfang der Seite platziert werden im Kopf, nicht auf dem Boden platzieren. Auf diese Weise führt der IE diesen Code aus, bevor er die Seiten-Tags analysiert.