従来のドキュメントオブジェクトモデルに対する JavaScript のサポートについての簡単な紹介

従来のドキュメントオブジェクトモデルに対する JavaScript のサポートについての簡単な紹介_基礎知識

WBOY

リリース： 2016-05-16 15:54:39

オリジナル

993 人が閲覧しました

これは、JavaScript 言語の以前のバージョンで導入されたモデルです。すべてのブラウザーでサポートされていますが、フォーム、フォーム要素、画像など、ファイルの特定の重要な部分へのアクセスのみが許可されます。

このモデルは、タイトル、URL、最終変更など、ドキュメント全体に関する情報を提供するいくつかの読み取り専用プロパティを提供します。さらに、このモデルによって提供される、ドキュメントのプロパティ値を設定および取得するために使用できるさまざまなメソッドがあります。
従来の DOM のドキュメントプロパティ:

以下は、従来の DOM を使用してアクセスできるドキュメントプロパティのリストです:

2015616103205974.jpg (662×762)

2015616103233946.jpg (655×726)

従来の DOM のドキュメントメソッド:

従来の DOM でサポートされているメソッドのリストは次のとおりです:

2015616103255189.jpg (681×498)

例:

HTML DOM を使用すると、あらゆる HTML 要素、あらゆる HTML ドキュメントを検索できます。たとえば、Web ドキュメントに form 要素が含まれている場合、JavaScript を使用してそれを document.forms[0] と呼ぶことができます。 Web ドキュメントに 2 つのフォーム要素が含まれる場合、最初のフォームは document.forms[0] と呼ばれ、2 番目のフォームは document.forms[1] と呼ばれます。

上記の階層構造とプロパティを使用して、document.forms[0].elements[0] などを使用できます。

従来の DOM メソッドを使用してドキュメントプロパティにアクセスする例を次に示します。

<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>

ログイン後にコピー

注: この例では、フォームやコンテンツなどのオブジェクトが返されます。これらのオブジェクトの値にアクセスするには、このチュートリアルでは説明されていないこれらのオブジェクトのプロパティを使用する必要があります。