Đối tượng HTML DOM DD

Đối tượng HTML DOM DD được liên kết với phần tử HTML

có trong danh sách Định nghĩa được ký hiệu bằng phần tử

Cú pháp

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

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

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

Ví dụ

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

<!DOCTYPE html>
<html>
<body>
<h2>dd object example</h2>
<p>Click the button below to create a dd element with some text in it</p>
<button onclick="create_dd()">CREATE</button><br><br>
<dl id="DL1">
<dt>Mango</dt>
</dl>
<script>
   function create_dd() {
      var d = document.createElement("DD");
      var txt = document.createTextNode("Mango is called the king of fruits.");
      d.appendChild(txt);
      var ele= document.getElementById("DL1");
      ele.appendChild(d);
   }
</script>
</body>
</html>

Đầu ra

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

Đối tượng HTML DOM DD

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

Đối tượng HTML DOM DD

Trong ví dụ trên -

Chúng tôi đã tạo một danh sách định nghĩa với id “DL1”. Nó có một phần tử

bên trong - <dl id="DL1"> <dt>Mango</dt> </dl> Sau đó, chúng tôi đã tạo một nút CREATE sẽ thực thi phương thức create_dd () khi người dùng nhấp vào - <button onclick="create_dd()">CREATE</button><br><br> Phương thức create_dd () tạo một phần tử

bằng cách sử dụng phương thức createElement () trên đối tượng tài liệu và gán nó cho biến d. Sau đó, nó tạo một nút văn bản bằng phương thức createTextNode () và gán nó cho biến txt. Sau đó, nút văn bản được thêm vào dưới dạng phần tử con của phần tử

bằng phương thức appendChild ().

Sau đó, phần tử

cùng với nút văn bản được thêm vào làm phần tử con của danh sách định nghĩa bằng cách sử dụng lại phương thức appendChild ()−

function create_dd() {
   var d = document.createElement("DD");
   var txt = document.createTextNode("Mango is called the king of fruits.");
   d.appendChild(txt);
   var ele= document.getElementById("DL1");
   ele.appendChild(d);
}