ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptでDOM要素を取得する方法をまとめます。
JavaScriptでDOM要素を取得する方法をまとめます。
- yuliaオリジナル
- 2018-10-08 11:43:553143ブラウズ
仕事では、特定の要素を取得し、それらの要素のスタイルやコンテンツなどを変更する必要があることがよくあります。DOM 要素を取得するためにどのメソッドを使用できるかご存知ですか?この記事では、getElementById()、getElementsByName() など、JavaScript で DOM 内の要素を取得および検索するさまざまな方法について説明します。必要な方は参考にしていただければ幸いです。
1. getElementById()
指定された id 属性値を通じて指定された要素を取得します。指定された ID を持つ要素が存在しない場合は null が返され、指定された ID を持つ要素が複数ある場合は unfineed が返されます。すべてのブラウザは getElementById() メソッドをサポートしています。
記述方法：document.getElementById(id)
例：h1タグをクリックすると、h1タグの値を表示するプロンプトボックスが表示されます コードは以下の通りです。 :
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1 id="title" onclick="myValue()">我是标题h1</h1>
</body>
<script type="text/javascript">
function myValue()
{
var a=document.getElementById("title")
alert(a.innerHTML)
}
</script>
</html>レンダリング:
2. getElementsByClassName()
要素を取得します。指定されたクラス属性値を通じて。指定されたクラス名を持つ要素のコレクション、つまりオブジェクトのコレクションを返します。 getElementsByClassName は、ドキュメントだけでなく、任意の要素に対して呼び出すことができます。このメソッドを呼び出す要素は、この検索のルート要素として使用されます。
ブラウザのサポートは次のとおりです:
書き込みメソッド: document.getElementsByClassName(names)
3 getElementsByTagName##特定のタグ名を通じて要素を取得すると、指定されたタグ名を持つコレクション (オブジェクトのコレクション) が返されます。 getElementsByTagName() メソッドは、ドキュメント内に出現する順序で要素を返します。すべてのブラウザは getElementsByTagName() メソッドをサポートしています。
メソッドの記述: document.getElementsByTagName(tagname)
4. getElementsByName(name)getElementsByName メソッドは、getElementById メソッドと似ています。違いは、前者は要素の name 属性をクエリするもので、これは要素の id 属性をクエリするものです。指定された名前を持つオブジェクトのコレクションを返します。すべてのブラウザは getElementsByName() メソッドをサポートしています。
記述方法: document.getElementsByName(name)
上記では、JavaScript で要素を取得する 4 つのメソッド (getElementById(id)、getElementsByClassName(names)、getElementsByTagName(tagname)、getElementsByName) を紹介しました。 ( name) さん、どの方法を使用するかはあなたの仕事のニーズによって異なります。この記事が役立つことを願っています。
以上がJavaScriptでDOM要素を取得する方法をまとめます。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。