ホームページ  >  記事  >  ウェブフロントエンド  >  HTML DOM getAttributeNode() 方法

HTML DOM getAttributeNode() 方法

WBOY
WBOY転載
2023-08-26 13:21:101242ブラウズ

HTML DOM getAttributeNode() は、指定された要素の属性ノードを Attr オブジェクトとして返すために使用されます。さまざまな Attr オブジェクトのプロパティとメソッドを使用して属性を操作できます。

構文

次に、getAttributeNode() メソッドの構文を示します。

element.getAttributeNode(attributename)

ここで、attributename は文字列型の必須パラメータであり、必要な属性名を指定します。戻るために。

Example

getAttributeNode() のメソッドの例を見てみましょう -

<!DOCTYPE html>
<html>
<head>
<script>
   function getAttrNode(){
      var a = document.getElementsByTagName("a")[0].getAttributeNode("href");
      var val=a.value;
      document.getElementById("Sample").innerHTML = val;
   }
</script>
</head>
<body>
<h1>getAttributeNode() example</h1>
<a href="https://www.google.com">GOOGLE</a>
<p>Get the href attribute value of the above link by clicking the below button</p>
<button onclick="getAttrNode()">GET</button>
<p id="Sample"></p>
</body>
</html>

出力

これにより、次の出力が生成されます -

HTML DOM getAttributeNode() 方法

[取得] ボタンをクリックしたとき -

HTML DOM getAttributeNode() 方法

上記の例では -

まず、次のアンカー要素を作成します。 href 属性値は「https://www.google.com」に設定されます。

<a href="https://www.google.com">GOOGLE</a>

次に、ユーザーがクリックしたときに getAttrNode() を実行する GET ボタンを作成しました。 -

<button onclick="getAttrNode()">GET</button>

getAttrNode() メソッドは getElementByTagName() メソッドを使用して HTML ドキュメント内の項目を取得します。要素。次に、パラメータ値「href」を指定して getAttributeNode("href") メソッドを使用します。

getAttributeNode() メソッドは、href 属性を表す attr オブジェクトを返し、それを変数 a に割り当てます。次に、attr オブジェクトの「value」属性を使用して、href 属性値を変数 val に割り当てます。取得した href 属性値は、innerHTML 属性 -

function getAttrNode(){
   var a = document.getElementsByTagName("a")[0].getAttributeNode("href");
   var val=a.value;
   document.getElementById("Sample").innerHTML = val;
}
を使用して ID「Sample」の段落に表示されます。

以上がHTML DOM getAttributeNode() 方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はtutorialspoint.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。