Đối tượng cơ sở HTML DOM

Đối tượng HTML DOM Base được liên kết với phần tử HTML . Phần tử được sử dụng để chỉ định url cơ sở cho tất cả các URL khác trong tài liệu HTML. Có thể có nhiều nhất một phần tử trong một tài liệu HTML. Đối tượng Base được sử dụng để đặt hoặc lấy thuộc tính href của phần tử .

Thuộc tính

Sau đây là các thuộc tính của đối tượng Base -

Thuộc tính	Mô tả
href	Đặt hoặc trả về giá trị của thuộc tính href trong phần tử cơ sở
target	Đặt hoặc trả về giá trị của thuộc tính đích trong phần tử cơ sở

Cú pháp

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

Tạo phần tử cơ sở -

document.createElement ("base")

Truy cập phần tử cơ sở -

var a = document.getElementById("demoBase");

Ví dụ

Hãy để chúng tôi xem một ví dụ về đối tượng cơ sở -

<!DOCTYPE html>
<html>
<body>
<p>Create the element first and then access it</p>
<p>Click the button below to create or access BASE element.</p>
<button onclick="CreateBase()">CREATE</button>
<button onclick="AcessBase()">ACCESS</button>
<p id="SAMPLE"></p>
<script>
   function CreateBase() {
      var x = document.createElement("BASE");
      x.setAttribute("id","myBase");
      x.setAttribute("href", "https://www.google.com");
      document.head.appendChild(x);
      document.getElementById("SAMPLE").innerHTML = "BASE element with href
      https://www.google.com is created";
   }
   function AcessBase() {
      var x = document.getElementById("myBase").href;
      document.getElementById("SAMPLE").innerHTML = x;
   }
</script>
</body>
</html>

Đầu ra

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

Đối tượng cơ sở HTML DOM

Khi nhấp vào TẠO -

Đối tượng cơ sở HTML DOM

Khi nhấp vào TRUY CẬP -

Đối tượng cơ sở HTML DOM

Trong ví dụ trên -

Chúng tôi đã tạo hai nút CREATE và ACCESS để thực thi chức năng CreateBase () và AccessBase () tương ứng.

<button onclick="CreateBase()">CREATE</button>
<button onclick="AcessBase()">ACCESS</button>

Hàm CreateBase () tạo một phần tử cơ sở và gán nó cho biến x. Sau đó, sử dụng phương thức setAttribute (), chúng tôi đặt id và href của nó. Phần tử cơ sở mới được tạo sau đó sẽ được thêm vào phần đầu tài liệu bằng thuộc tính appendChild (). Cuối cùng, thông báo tạo cơ sở được hiển thị trong đoạn có id SAMPLE được liên kết với nó.

function CreateBase() {
   var x = document.createElement("BASE");
   x.setAttribute("id","myBase");
   x.setAttribute("href", "https://www.google.com");
   document.head.appendChild(x);
   document.getElementById("SAMPLE").innerHTML = "BASE element with href https://www.google.com is created";
}

Hàm AcessBase () được tạo để truy cập phần tử mới được tạo của chúng ta. Nó làm như vậy bằng cách lấy phần tử theo id và sau đó nhận giá trị href của nó và gán nó cho một biến có tên x. Thông tin trong x sau đó được hiển thị thành đoạn văn có id SAMPLE.

function AcessBase() {
   var x = document.getElementById("myBase").href;
   document.getElementById("SAMPLE").innerHTML = x;
}