HTML DOM 앵커 rel 속성

HTML DOM Anchor Rel 속성은 링크의 rel 속성을 반환합니다. rel 속성은 실행 중인 문서와 링크된 문서 간의 연결을 설명합니다.

구문

다음은 −

구문입니다.

a) rel 속성 반환 -

anchorObject.rel

b) rel 속성을 &빼기
로 설정합니다.

anchorObject.rel = "value"

예시

HTML DOM 앵커 rel 속성의 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<body>
<h1>Example</h1>
<p><a id="anchorExample" rel="Rel Property" href="https://www.examplesite.com/">
Anchor Rel Property</a></p>
<p>Click on the button</p>
<button onclick="display()">Click me!</button>
<p id="show"></p>
<script>
   function display() {
      var docs = document.getElementById("anchorExample").rel;
      document.getElementById("show").innerHTML = docs;
   }
</script>
</body>
</html>

출력

이것은 다음과 같은 출력을 생성합니다 -

HTML DOM 앵커 rel 속성

"나를 클릭하십시오!"를 클릭하십시오. HTML DOM Anchor rel 속성을 가져오는 버튼 -

HTML DOM 앵커 rel 속성

위의 예에서 -

위 코드에서 https://www.examplesite.com/인 링크된 문서에 대한 관계 유형을 지정하는 데 사용되는 rel 속성이 있는 앵커 태그를 가져왔습니다.

<p>
<a id="anchorExample" rel="Rel Property" href="https://www.examplesite.com/">Anchor Rel Property</a>
</p>

그런 다음 디스플레이 기능을 실행하기 위해 "Click Me"라는 버튼을 만들었습니다.

<button onclick="display()">Click me!</button>

display 함수는 id="Anchor example"인 요소의 rel 속성을 가져옵니다. -

function display() {
   var docs = document.getElementById("anchorExample").rel;
   document.getElementById("show").innerHTML = docs;
}

그런 다음 디스플레이 기능을 실행하기 위해 "Click Me"라는 버튼을 만들었습니다.