Thuộc tính mục tiêu cơ sở HTML DOM

Thuộc tính mục tiêu HTML DOM Base được liên kết với phần tử HTML . Nó được sử dụng để đặt hoặc trả về giá trị của thuộc tính đích của phần tử . Thuộc tính đích được sử dụng để chỉ định nơi siêu kết nối sẽ mở. Nó có thể mở trong chính trang đó hoặc trong một trang mới.

Thuộc tính

Sau đây là các giá trị cho các thuộc tính đích -

Giá trị thuộc tính	Mô tả
_blank	Để mở liên kết trong cửa sổ mới.
_self	Để mở liên kết trong cùng một khung mà nó đã được nhấp vào. Tôi là hành vi mặc định.
_parent	Để mở liên kết trong bộ khung chính.
_top	Để mở liên kết trong toàn bộ phần nội dung của cửa sổ.
tên khung	Để mở liên kết trong tên khung được chỉ định.

Cú pháp

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

Trả lại thuộc tính đích -

baseObject.target

Đặt thuộc tính mục tiêu -

baseObject.target = "_blank|_self|_parent|_top|framename"

Ví dụ

Hãy để chúng tôi xem một ví dụ cho thuộc tính đích HTML DOM -

<!DOCTYPE html>
<html>
<head>
<base id="Base" target="newframe1" href="https://www.example.com">
</head>
<body>
<p>Click the below button to get the target attribute value</p>
<button onclick="getTarget()">GET TARGET</button>
<p>Click the below button to set the target attribute value</p>
<button onclick="setTarget()">SET TARGET</button>
<p id="Sample"></p>
<script>
   function getTarget() {
      var x = document.getElementById("Base").target;
      document.getElementById("Sample").innerHTML = "Base target for all links is: " + x;
   }
   function setTarget(){
      document.getElementById("Base").target="_blank"
      document.getElementById("Sample").innerHTML="Target has been changed from
      newframe1 to _blank"
   }
</script>
</body>
</html>

Đầu ra

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

Thuộc tính mục tiêu cơ sở HTML DOM

Khi nhấp vào NHẬN MỤC TIÊU -

Thuộc tính mục tiêu cơ sở HTML DOM

Khi nhấp vào ĐẶT MỤC TIÊU -

Thuộc tính mục tiêu cơ sở HTML DOM

Trong ví dụ trên -

Đầu tiên chúng ta đã tạo hai nút GET TARGET và SET TARGET để thực thi các hàm getTarget () và setTarget () tương ứng -

<button onclick="getTarget()">GET TARGET</button>
<button onclick="setTarget()">SET TARGET</button>

Hàm getTarget () nhận phần tử có id “Base” là phần tử trong trường hợp của chúng ta. Thuộc tính mục tiêu của phần tử cơ sở được gán cho một biến x. Sau đó, giá trị thuộc tính đích được hiển thị trong đoạn văn có id “Sample” bằng thuộc tính innerHTML ().

function getTarget() {
   var x = document.getElementById("Base").target;
   document.getElementById("Sample").innerHTML = "Base target for all links is: " + x;
}

Hàm setTarget () nhận phần tử có id “Base” là phần tử trong trường hợp của chúng ta. Sau đó, thuộc tính mục tiêu của phần tử được đặt thành “_blank” nghĩa là nó sẽ mở trong tab mới. Sau đó, "Mục tiêu đã được thay đổi từ newframe1 thành _blank" sau đó được hiển thị trong đoạn có id "Sample" được liên kết với nó.