Đối tượng Chi tiết DOM HTML được liên kết với phần tử HTML
Thuộc tính
Sau đây là thuộc tính cho đối tượng Chi tiết -
| Sr.No | Thuộc tính &Mô tả |
|---|---|
| 1 | mở Để thiết lập hoặc quay lại xem chi tiết có được hiển thị cho người dùng hay không. |
Cú pháp
Sau đây là cú pháp cho -
Tạo đối tượng Chi tiết -
var p = document.createElement("DETAILS"); Ví dụ
Hãy để chúng tôi xem xét một ví dụ cho đối tượng Chi tiết DOM HTML -
<!DOCTYPE html>
<html>
<body>
<h2>Details object</h2>
<p>Click the below button to create a DETAILS element about a monument</p>
<button onclick="detCreate()">CREATE</button>
<br><br>
<script>
function detCreate() {
var et = document.createElement("DETAILS");
var sum=document.createElement("SUMMARY");
var sumText=document.createTextNode("Eiffel Tower");
var txt = document.createTextNode("It is one of the most popular monument in the world");
sum.appendChild(sumText);
et.appendChild(txt);
document.body.appendChild(sum);
document.body.appendChild(et);
}
</script>
</body>
</html> Đầu ra
Điều này sẽ tạo ra kết quả sau -
Khi nhấp vào nút TẠO và sau đó mở rộng chi tiết bằng cách nhấp vào mũi tên -
Trong ví dụ trên -
Chúng tôi đã tạo một nút CREATE sẽ thực thi hàm detCreate () khi người dùng nhấp vào -
<button onclick="detCreate()">CREATE</button>
Hàm detCreate () tạo một phần tử là một phần của phần tử
Sau đó, hai nút văn bản sumtxt và txt được tạo ra, được nối vào phần tử và phần tử chi tiết mới được tạo được thêm vào nội dung tài liệu bằng phương thức appendChild () và chuyển các phần tử sẽ được thêm vào dưới dạng tham số -
function detCreate() {
var et = document.createElement("DETAILS");
var sum=document.createElement("SUMMARY");
var sumText=document.createTextNode("Eiffel Tower");
var txt = document.createTextNode("It is one of the most popular monument in the world");
sum.appendChild(sumText);
et.appendChild(txt);
document.body.appendChild(sum);
document.body.appendChild(et);
}