Computer >> Máy Tính >  >> Lập trình >> HTML

Đối tượng HTML DOM DFN

Đối tượng HTML DOM DFN được liên kết với phần tử HTML . Văn bản bên trong phần tử là văn bản đang được xác định trong ngữ cảnh xung quanh. Đối tượng DFN đại diện cho phần tử .

Cú pháp

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

Tạo đối tượng DFN -

var p = document.createElement("DFN");

Ví dụ

Hãy để chúng tôi xem xét một ví dụ cho đối tượng HTML DOM DFN -

<!DOCTYPE html>
<html>
<body>
<h2>DFN object example</h2>
<p>Click the below button to create a dfn element with some text inside it.</p>
<button onclick="dfnCreate()">CREATE</button> <br><br>
<script>
   function dfnCreate() {
      var x = document.createElement("DFN");
      var t = document.createTextNode("The defination element");
      x.appendChild(t);
      document.body.appendChild(x);
   }
</script>
</body>
</html>

Đầu ra

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

Đối tượng HTML DOM DFN

Khi nhấp vào nút TẠO -

Đối tượng HTML DOM DFN

Đầu tiên, chúng tôi đã tạo một nút CREATE sẽ thực thi hàm dfnCreate () khi người dùng nhấp vào -

<button onclick="dfnCreate()">CREATE</button>

Phương thức dfnCreate () tạo một phần tử bằng cách sử dụng phương thức createElement () của đối tượng tài liệu. Sau đó, nó tạo một nút văn bản bằng phương thức createTextNode (). Sau đó, nút văn bản được nối dưới dạng phần tử con vào phần tử . Cuối cùng, phần tử cùng với nút văn bản được thêm vào dưới dạng phần tử con của nội dung tài liệu bằng cách sử dụng phương thức appendChild () -

function dfnCreate() {
   var x = document.createElement("DFN");
   var t = document.createTextNode("The definition element");
   x.appendChild(t);
   document.body.appendChild(x);
}