Die Geburt von DOCTYPE
DOCTYPE, auch bekannt als Document Type Declaration (Document Type Declaration, Abkürzung DTD). Normalerweise steht DOCTYPE ganz am Anfang eines HTML-Dokuments, vor dem öffnenden Tag des Root-HTML-Elements. Da der Browser den Typ des aktuellen Dokuments bestimmen muss, bevor er den Textkörper des HTML-Dokuments analysiert, um den Rendering-Modus zu bestimmen, den er übernehmen muss. Verschiedene Rendering-Modi wirken sich auf das Parsen von CSS-Code und sogar JavaScript-Skripten durch den Browser aus. Insbesondere in den Browsern der IE-Serie ist der durch DOCTYPE bestimmte Rendering-Modus der HTML-Seite entscheidend.
Schauen wir uns zunächst an, wie die Seite in jedem Browser gerendert und analysiert wird, wenn ein HTML-Dokument keinen DOCTYPE hat. Wir versuchen, ein HTML-Dokument ohne DOCTYPE am Anfang zu generieren:
<html>
<head></head>
<body>
<script>
document.write(document.compatMode);
</script>
</body>
</html>
Nach dem Login kopieren
Diese Seite liefert in allen Browsern konsistente Ergebnisse, wobei „BackCompat“ auf der Seite aufgedruckt ist. Die document.compatMode-Eigenschaft wurde ursprünglich von Microsoft im IE erstellt. Dies ist eine schreibgeschützte Eigenschaft, die eine Zeichenfolge zurückgibt. Es gibt nur zwei mögliche Rückgabewerte:
Tatsächlich ist hier der sogenannte Standardkompatibilitätsmodus, der „Promiscuous-Modus“ (auch Quirks-Modus genannt), nicht aktiviert, und der Standardkompatibilitätsmodus ist aktiviert. Dies ist der „Standardmodus“ (auch Strict Mode genannt), Standardmodus oder Strict Mode. Daher wird im vorherigen Testbeispiel das HTML-Dokument ohne DOCTYPE in allen Browsern im gemischten Modus gerendert und analysiert.
Warum nehmen Browser einen solchen „Wechsel“ vor? IE6, der langlebigste unter den von Microsoft entwickelten Browsern der IE-Serie, wurde mit Windows XP geboren. Im Vergleich zur Vorgängerversion IE5.5 weist IE6 viele wesentliche Verbesserungen auf. Die größte Änderung beim Seitenrendering besteht darin, dass IE6 einige Funktionen in CSS1 unterstützt. Wenn Sie beispielsweise die Breite und Höhe eines Elements auf Blockebene festlegen, wirkt sich dies nicht mehr auf die Randperipherie aus, sondern nur auf den Elementinhalt, wie in der W3C-Spezifikation beschrieben. Dies unterscheidet sich stark von IE5.5. Um sicherzustellen, dass die in den späten 1990er Jahren auf der Grundlage von Versionen vor IE6 entwickelten Seiten normal angezeigt werden können, dh um sicherzustellen, dass der Browser abwärtskompatibel ist, hat Microsoft versucht, dies zu tun
DOCTYPE wird verwendet, um zu bestimmen, in welchem Modus der Browser arbeiten soll, also ob es sich um IE6 oder IE5.5 handelt. Aus dem von document.compatMode zurückgegebenen Zeichenfolgenwert ist also auch ersichtlich, dass BackCompat die Abwärtskompatibilität (dh IE5.5) und CSS1Compat die Kompatibilität mit der CSS1-Spezifikation (dh IE6) darstellt. Dadurch wird der Arbeitsmodus des Browsers in gemischten Modus und Standardmodus unterteilt.
Es ist erwähnenswert, dass die Versionsnummer des IE von 6.0 auf die aktuelle 9.0 aktualisiert wurde, das Upgrade jedoch nur im Standardmodus erfolgt. Im gemischten Modus ist die Versionsnummer des IE dauerhaft auf 5.5 eingefroren, was ebenfalls einen großen Einbußen für die Abwärtskompatibilität darstellt. Mit anderen Worten: Selbst wenn wir den neuesten und fortschrittlichsten IE9 verwenden und keinen DOCTYPE schreiben oder einen DOCTYPE verwenden, der den gemischten Modus auslösen kann, entspricht der Browser, mit dem wir es zu tun haben, immer noch dem antiken IE5.5 von mehr als Vor zehn Jahren. Es gibt keinen so großen Unterschied zwischen dem gemischten Modus und dem Standardmodus anderer Browser wie im IE.
Angenäherter Standardmodus
Der Fast-Standardmodus ist buchstäblich derselbe wie der Standardmodus. Sehr ähnlich, hat aber kleine Unterschiede. Dies spiegelt sich hauptsächlich in der unterschiedlichen Darstellung des vertikalen Layouts innerhalb von Tabellenzellen wider. Ab IE8, Firefox, Chrome, Safari und Opera 7.5 folgt der Standardmodus dieser Browser strenger der CSS2.1-Spezifikation, sodass der bisherige Standardmodus, der derzeit nicht als „Standard“ zu gelten scheint, mit „ „Annähernd „Standardmodus““-Name. In den früheren Versionen von IE6, IE7 und Opera vor 7.5 konnten Browser jedoch nicht strikt der CSS2.1-Spezifikation folgen, sodass es für sie keinen ungefähren Standardmodus gab. Es kann auch verstanden werden, dass ihr ungefährer Standardmodus der Standardmodus ist .
Bisher können Sie sehen, dass jeder Browser hauptsächlich drei Modi enthält. Im HTML5-Entwurf ist die Definition von Mustern klarer definiert:
| 传统名称 |
HTML5 草案名称 |
document.compatMode 返回值 |
| standards mode 或者 strict mode |
no-quirks mode |
CSS1Compat |
| almost standards mode |
limited-quirks mode |
CSS1Compat |
| quirks mode |
quirks mode |
BackCompat |
DOCTYPE 的选择
工作模式简介
浏览器的工作模式常被称为“渲染模式”。实际上浏览器不同的工作模式不仅对渲染有影响，对代码的解析以及脚本的行为也同样有影响。
从更广泛的角度来看，浏览器的工作模式的差异不仅体现在处理 HTML 页面的时候，处理 XML 及一些非 WEB 内容时也有模式上的差异，但本文仅讨论浏览器在处理 HTML 页面时工作模式。1
工作模式的来源及变迁
不使用 DOCTYPE 一定会使 HTML 文档处于混杂模式，然而使用了 DOCTYPE，也不一定就能够使文档在所有浏览器中均处于标准模式。DOCTYPE 本身不就是一个“开关”吗？为何在有 DOCTYPE 的 HTML 文档之上仍然还会出现混杂模式？这个和以下条件有关：
我们先说第一个条件。HTML 历史悠久，仅正确的 HTML 类型的 DOCTYPE 就有很多种。先看一个标准的 DOCTYPE：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Nach dem Login kopieren
上面的 DOCTYPE 包含 6 部分：
字符串“
根元素通用标识符“HTML”
字符串“PUBLIC”
被引号括起来的公共标识符（publicId）“-//W3C//DTD HTML 4.01//EN”
被引号括起来的系统标识符（systemId）“http://www.w3.org/TR/html4/strict.dtd”
字符串“>”
Der universelle Bezeichner des Stammelements, der öffentliche Bezeichner und der Systembezeichner können durch Aufrufen der DOM-Schnittstelle über Skripte abgerufen werden, die document.doctype.name, document.doctype.publicId und document.doctype entsprechen bzw. systemId (nicht unterstützt von IE6 IE7).
Die oben genannten drei Teile können zwischen verschiedenen DOCTYPEs unterschiedlich sein. Einige DOCTYPEs haben bestimmte Teile davon.
Tatsächlich berücksichtigt der Browser beim Sniffing von DOCTYPE nur die Teile 1, 2, 4 und 6 der oben genannten 6 Teile und unterscheidet nicht zwischen Groß- und Kleinschreibung. In jeder Browser-Kernel-Implementierung gibt es fast immer eine Liste zum Aufzeichnen der Muster, die diesen allgemeinen DOCTYPEs entsprechen, beispielsweise die Datei DocTypeStrings.gperf im WebKit-Kernel. Der Unterschied in den Auslösemodi in der Liste der einzelnen Browser führt dazu, dass einige DOCTYPEs in verschiedenen Browsern unterschiedliche Modi auslösen, z. B. . Für DOCTYPEs außerhalb der Liste lösen Unterschiede in der Verarbeitung zwischen Browsern auch unterschiedliche Modi aus. Beispielsweise behandeln einige Browser DOCTYPEs außerhalb der Liste als gemischten Modus, während andere sie als Standardmodell behandeln.
Wenn wir uns also für DOCTYPE entscheiden, stellen wir zunächst sicher, dass das HTML-Dokument den Standardmodus verwenden soll.
Wenn Sie nach Einfachheit streben, ist der DOCTYPE von HTML5 die beste Wahl: . Alle gängigen Browser verwenden diese kürzeste DOCTYPE-Ansicht, die nur die Teile 1, 2 und 6 enthält Standardmodus.
Wenn Sie Stabilität anstreben, ist auch der frühere DOCTYPE von HTML4.01 Strict eine gute Wahl: , der Modus, den es in allen gängigen Browsern auslöst, ist genau der gleiche wie der obige HTML5.
Manchmal befinden wir uns in besonderen Situationen und möchten, dass sich der Browser in einem nahezu standardmäßigen Modus befindet. Dann können Sie Folgendes auswählen: .
Inhalte, die nicht vor DOCTYPE erscheinen können
Wie bereits erwähnt, dient DOCTYPE als Entscheidungsträger für Browser Welcher Modus-„Schalter“ das HTML-Dokument annimmt, sollte am Anfang des HTML-Dokuments erscheinen. Aber manchmal verhindern einige Autoren aus bestimmten Gründen einige Inhalte vor DOCTYPE, bei denen es sich möglicherweise um einige vom Server ausgegebene Informationen handelt. Dadurch wird der Browser extrem „verwirrt“. Das erste, was er sieht, ist kein DOCTYPE, sodass er möglicherweise denkt, dass die Seite keinen DOCTYPE hat, und der gemischte Modus ausgelöst wird. Tatsächlich handhabt jeder Browser dies jedoch anders. Wir klassifizieren den Inhalt, der vor DOCTYPE erscheinen kann. Dazu gehören:
Normaler Text
HTML-Tag
-
HTML-Kommentare
XML-Deklaration
IE-bedingter Kommentar
Bei normalen Text- und HTML-Tags wechseln alle Browser in den gemischten Modus aktiviert ist, was leicht zu verstehen ist. Sie können den verdächtigen HTML-Dokumenttext sehen und der Browser wird wahrscheinlich nicht herausfinden, wo sich der DOCTYPE befindet.
Bei HTML-Kommentaren und XML-Deklarationen unterscheiden sie sich etwas von den oben genannten normalen Text- und HTML-Tags. Sie werden nicht auf der Seite angezeigt, das heißt, sie sind nicht sichtbar. Derzeit scheinen einige Browser sehr „intelligent“ zu sein, und Nicht-IE-Browser ignorieren ihre Existenz und DOCTYPE wird korrekt analysiert. Allerdings führen in IE6 XML-Deklarationen vor DOCTYPE dazu, dass die Seite in den Promiscuous-Modus wechselt, und alle IE bewirken, dass Seiten mit HTML-Kommentaren vor DOCTYPE in den Promiscuous-Modus wechseln. Wenn dies in IE9 passiert, gibt der Browser in der Konsole eine Meldung aus: „HTML1113: Dokumentmodus von IE9 Standard auf Quirks neu gestartet.“
“, es scheint, dass Microsoft derzeit nicht die Absicht hat, „dem Trend zu folgen“. Dies kann Autoren dazu drängen, zu vermeiden, vor DOCTYPE andere Inhalte hinzuzufügen vor DOCTYPE. Er könnte schreiben:
Hinweis: Über IE-bedingte Kommentare
Durch die obige historische Überprüfung und Analyse haben wir die Schlüsselrolle von DOCTYPE in den aktuellen Mainstream-Browsern erkannt. Gleichzeitig haben wir auch den besten DOCTYPE entdeckt, der den Standardmodus jedes Browsers minimieren kann Risiko von Kompatibilitätsproblemen zwischen verschiedenen Browsern. Wählen Sie den richtigen DOCTYPE aus und stellen Sie sicher, dass sich der DOCTYPE am absoluten Anfang des HTML-Dokuments befindet. Dies ist der Schlüssel dafür, dass DOCTYPE seine richtige Rolle spielt
.
Testumgebung
| 操作系统版本: |
Windows 7 Ultimate build 7600 |
| 浏览器版本: |
IE6
IE7
IE8
IE9
Firefox 4.0.1
Chrome 12.0.742.100
Safari 5.0.5
Opera 11.11 |
| 测试页面: |
|
| 本文更新时间: |
2011-06-17 |
Schlüsselwörter
Browserkompatibilität Rendering-Modus Standardmodus Gemischter Modus DOCTYPE DTD
Das obige ist der detaillierte Inhalt vonEinführung in DOCTYPE und Browser-Rendering. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
