>  기사  >  웹 프론트엔드  >  HTML DOM getAttributeNode() 메소드

HTML DOM getAttributeNode() 메소드

WBOY
WBOY앞으로
2023-08-26 13:21:101195검색

HTML DOM getAttributeNode()는 주어진 요소의 속성 노드를 Attr 객체로 반환하는 데 사용됩니다. 다양한 Attr 객체 속성과 메서드를 사용하여 속성을 조작할 수 있습니다.

Syntax

다음은 getAttributeNode() 메서드의 구문입니다. -

element.getAttributeNode(attributename)

여기서 attributename은 반환하려는 속성 이름을 지정하는 문자열 유형의 필수 매개 변수입니다.

예제

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() 方法

Get 버튼을 클릭할 때 -

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 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 tutorialspoint.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제