JavaScriptのid属性を通じてページ要素を取得する方法-jsチュートリアル-php.cn

JavaScriptのid属性を通じてページ要素を取得する方法

醉折花枝作酒筹

リリース： 2023-01-06 11:17:07

オリジナル

9413 人が閲覧しました

JavaScript では、getElementById メソッドを使用してページ要素を取得できます。構文形式は「document.getElementById("id name")」です。 getElementById メソッドは、指定された ID を持つ最初のオブジェクトへの参照を返します。

JavaScriptのid属性を通じてページ要素を取得する方法

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

Webページはタグで情報を整理しており、タグのid属性値は一意である javascriptで取得する要素の探し方

document.getElementById("id") //语法

ログイン後にコピー

以下のコードより、実行結果は null または [object HTMLParagraphElement]

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>通过ID获取元素</title>
        <script type="text/javascript">
            var myceshi=document.getElementById(&#39;ceshi&#39;);//获取元素存储在变量中
            // document.write(&#39;结果:&#39;+myceshi);//输出变量
            alert(myceshi);
            document.write(&#39;结果:&#39;+myceshi);//输出变量
        </script>
    </head>
    <body>
        <div id="ceshi">I love javascript</div>
        <!-- <script type="text/javascript">
            var myceshi=document.getElementById(&#39;ceshi&#39;);//获取元素存储在变量中
            // document.write(&#39;结果:&#39;+myceshi);//输出变量
            alert(myceshi);
            document.write(&#39;结果:&#39;+myceshi);//输出变量
        </script> -->
    </body>
</html>

ログイン後にコピー

取得された要素はオブジェクトです。要素を操作したい場合は、そのプロパティまたはメソッドを使用する必要があります。 (object HTMLParagraphElementはオブジェクトのHTML段落要素です。取得したものが要素です。この要素もオブジェクトです。取得したオブジェクトには中の値が表示されないので、オブジェクトHTMLParagraphElementが表示されます。中の値を取り出したい場合は、 innerHTML を使用して取得します)

getElementById() メソッドは、指定された ID を持つ最初のオブジェクトへの参照を返します。

要素を検索するための複数のメソッドを定義します。getElementById() に加えて、getElementsByName() および getElementsByTagName() もあります。

ただし、ドキュメント内の特定の要素を検索する必要がある場合、最も効率的なメソッドは getElementById() です。

ドキュメントの特定の要素を操作する場合は、その要素に id 属性を指定して (ドキュメント内で) 一意の名前を付けることが最善です。そうすれば、その ID を使用して目的の要素を見つけることができます。

[推奨学習: JavaScript 上級チュートリアル]

以上がJavaScriptのid属性を通じてページ要素を取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。