Eine kurze Einführung in die JavaScript-Unterstützung für das traditionelle Dokumentobjektmodell

Eine kurze Einführung in die JavaScript-Unterstützung für das traditionelle Dokumentobjektmodell_Grundkenntnisse

WBOY

Freigeben： 2016-05-16 15:54:39

Original

994 Leute haben es durchsucht

Dies ist das Modell, das in früheren Versionen der JavaScript-Sprache eingeführt wurde. Alle werden von allen Browsern unterstützt, ermöglichen jedoch nur den Zugriff auf bestimmte Schlüsselteile der Datei, wie z. B. Formulare, Formularelemente und Bilder.

Dieses Modell bietet mehrere schreibgeschützte Eigenschaften wie Titel, URL und letzte Änderung, die Informationen über das Dokument als Ganzes liefern. Darüber hinaus bietet dieses Modell verschiedene Methoden, mit denen Eigenschaftswerte des Dokuments festgelegt und abgerufen werden können.
Dokumenteigenschaften im traditionellen DOM:

Das Folgende ist eine Liste von Dokumenteigenschaften, auf die über herkömmliches DOM zugegriffen werden kann:

2015616103205974.jpg (662×762)

2015616103233946.jpg (655×726)

Dokumentmethode im traditionellen DOM:

Hier ist eine Liste der vom traditionellen DOM unterstützten Methoden:

2015616103255189.jpg (681×498)

Beispiel:

Mit HTML DOM können wir jedes HTML-Element und jedes HTML-Dokument finden. Wenn beispielsweise ein Webdokument ein Formularelement enthält, können wir es mithilfe von JavaScript document.forms[0] nennen. Wenn ein Webdokument zwei Formularelemente enthält, heißt das erste Formular document.forms[0] und das zweite document.forms[1].

Mit der oben angegebenen hierarchischen Struktur und den oben angegebenen Eigenschaften können Sie document.forms[0].elements[0] usw. verwenden.

Hier ist ein Beispiel für den Zugriff auf Dokumenteigenschaften mit herkömmlichen DOM-Methoden:

<html>
<head>
<title> Document Title </title>
<script type="text/javascript">
<!--
function myFunc()
{
  var ret = document.title;
  alert("Document Title : " + ret );

  var ret = document.URL;
  alert("Document URL : " + ret );

  var ret = document.forms[0];
  alert("Document First Form : " + ret );

  var ret = document.forms[0].elements[1];
  alert("Second element : " + ret );

}
//-->
</script>
</head>
<body>
<h1 id="title">This is main title</h1>
<p>Click the following to see the result:</p>

<form name="FirstForm">
<input type="button" value="Click Me" onclick="myFunc();" />
<input type="button" value="Cancel">
</form>

<form name="SecondForm">
<input type="button" value="Don't ClickMe"/>
</form>

</body>
</html>

Nach dem Login kopieren

HINWEIS: Dieses Beispiel gibt Objekte wie Form und Inhalt zurück, und wir müssen Eigenschaften dieser Objekte verwenden, die in diesem Tutorial nicht behandelt werden, um auf ihre Werte zuzugreifen.