JavaScript에서 링크의 id 속성 값을 가져오는 방법

JavaScript에서 링크(<a> 태그)의 id 속성 값을 가져오려면 id 프로퍼티를 사용하면 됩니다. 먼저 document.getElementById() 메서드로 해당 앵커 요소를 선택한 뒤, .id 프로퍼티에 접근하면 id 속성의 값을 문자열로 얻을 수 있습니다.

예제 코드

<!DOCTYPE html>
<html>
   <body>
      <p><a id="anchorid" hreflang="en-us" href="https://www.qries.com/">Qries</a></p>
      <script>
         var myID = document.getElementById("anchorid").id;
         document.write("링크의 id 속성 값: " + myID);
      </script>
   </body>
</html>

코드 설명

document.getElementById("anchorid")는 문서에서 id가 "anchorid"인 요소를 찾아 반환합니다. 이어서 .id 프로퍼티를 호출하면 해당 요소의 id 속성 값인 "anchorid" 문자열이 반환되며, 이 값이 변수 myID에 저장됩니다.

참고 사항

document.write()는 페이지 로딩 후 실행될 경우 문서 전체를 덮어쓸 수 있으므로, 실무에서는 console.log(myID)나 textContent를 사용하는 것이 좋습니다.
최신 방식으로는 document.querySelector('#anchorid').id처럼 CSS 선택자를 활용할 수도 있습니다.