Thuộc tính liên kết HTML DOM Anchor

Thuộc tính HTML DOM Anchor Rel trả về thuộc tính rel của một liên kết. Thuộc tính rel mô tả sự liên kết giữa tài liệu đang chạy và tài liệu được liên kết.

Cú pháp

Sau đây là cú pháp để -

a) Trả lại thuộc tính rel -

anchorObject.rel

b) Đặt thuộc tính rel &trừ

anchorObject.rel = "value"

Ví dụ

Hãy để chúng tôi xem một ví dụ về thuộc tính liên kết liên kết HTML DOM -

<!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>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Thuộc tính liên kết HTML DOM Anchor

Nhấp vào "Nhấp vào tôi!" để lấy thuộc tính liên kết HTML DOM Anchor -

Thuộc tính liên kết HTML DOM Anchor

Trong ví dụ trên -

Chúng tôi đã sử dụng một thẻ liên kết với thuộc tính rel được sử dụng để chỉ định loại quan hệ với tài liệu được liên kết mà trong đoạn mã trên là https://www.examplesite.com/

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

Sau đó, chúng tôi đã tạo một nút có tên “Click Me” để thực thi chức năng hiển thị -

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

Hàm display nhận thuộc tính rel của phần tử với id =”Anchor example” -

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

Sau đó, chúng tôi đã tạo một nút có tên “Click Me” để thực thi chức năng hiển thị -