Tatsächlicher HTML5-Kampf und Analyse von HTMLDocument-Änderungen

Ich habe Ihnen bereits einige der neuen Ergänzungen zu HTML5 vorgestellt und ich glaube, Sie alle haben ein gewisses Verständnis dafür. Heute werde ich Ihnen die neu hinzugefügten Inhalte in HTML5 bezüglich HTMLDokument vorstellen. Was sind also die neu hinzugefügten Inhalte zu HTMLDocument in HTML5? Die neu hinzugefügten Inhalte zu HTMLDocument in HTML5 umfassen das Attribut „readyState“, die Beurteilung des Kompatibilitätsmodus und das Attribut „head“. Lassen Sie mich Ihnen diese neu hinzugefügten kleinen Dinge einzeln vorstellen.

1. readyState-Attribut

Bereits in der IE4-Ära führte das Dokumentobjekt das readyState-Attribut ein, das jedoch nie in den Standard aufgenommen wurde HTML5 wurde im Laufe der Zeit in die Norm integriert. Das Attribut „readyState“ hat zwei mögliche Werte:

(1) wird geladen, das Dokument wird geladen

(2) abgeschlossen, das Dokument wurde geladen

So verwenden Sie das Dokument angemessen Was ist mit .readyState? Der am besten geeignete Weg, document.readyState zu verwenden, besteht darin, einen Indikator dafür zu implementieren, dass das Dokument geladen wurde. Bis diese Eigenschaft allgemein unterstützt wird, erfordert die Implementierung eines solchen Indikators weiterhin, dass der Onload-Ereignishandler eine Bezeichnung setzt, die angibt, dass das Dokument geladen wurde. Das folgende Beispiel lautet wie folgt:

HTML-Code

<p>梦龙小站</p>
<p class="complete"></p>

JavaScript-Code

<script type="text/javascript">
window.onload = function(){
	var a = 0;
	var b = 0;
	if(document.readyState == "complete"){
		$(".complete").html( "加载好了" )
	}

	if(document.readyState == "loading"){
		$(".load").html( $(".load").html() + "<br/>" + a++ )
	}
};

Vorschaueffekt

2. Beurteilung des Kompatibilitätsmodus

Nach IE6 begann man, den Modus zum Rendern von Seiten zu unterscheiden, unterteilt in Standard- und gemischt, Erkennung Der Kompatibilitätsmodus der Seite wird zu einer notwendigen Funktion des Browsers. Zu diesem Zweck fügt der IE dem Dokument ein Attribut namens compatMode hinzu. Dieses Attribut soll dem Entwickler mitteilen, welchen Rendering-Modus der Browser verwendet. Wie im kleinen Beispiel unten gezeigt, ist der Wert von document.compatMode im Standardmodus gleich „CSS1Compat“, während im Promiscuous-Modus der Wert von document.compatMode gleich „BackCompat“ ist.

JavaScript-Code

if(document.compatMode == "CSS1Compat"){
	alert("标准模式")
}else{
	alert("混杂兼容模式")
}

3. Head-Attribut

Als Referenz auf das Body-Element des Dokuments. body Darüber hinaus hat HTML5 das Attribut document.head hinzugefügt, sodass auf das Head-Tag verwiesen werden kann. Die Verwendungsmethode lautet wie folgt:

JavaScript-Code

var head = document.head || document.getElementsByTagName("head")[0];

Genau wie oben aus Kompatibilitätsgründen verwenden Sie document.head, wenn es verwendet werden kann, andernfalls verwenden Sie weiterhin die Methode getElementsByTagName(). Die vom document.head-Attribut unterstützten Browser sind Chrome und Safari 5.

Der aktuelle HTML5-Kampf und die Analyse von HTMLDocument-Änderungen (readyState-Attribut, Kompatibilitätsmodus und Head-Attribut) werden hier inmitten Ihres vollen Terminkalenders eingeführt und setzen Ihr Lernen fort in die Praxis umsetzen Ich möchte ein paar kleine Dinge mit Ihnen teilen, es war so ein magischer Tag. Updates zur HTML5-Praxis und -Analyse.

[Verwandte Empfehlungen]

1. Kostenloses h5-Online-Video-Tutorial

2. HTML5-Vollversionshandbuch

3. php.cn Original-HTML5-Video-Tutorial

4. HTML5-Spielframework cnGameJS-Entwicklungsaufzeichnung – detaillierte Erklärung des Ressourcenlademodulcodes