Thuộc tính open của Details trong HTML DOM

Thuộc tính open của phần tử <details> là boolean, xác định nội dung chi tiết có hiển thị hay ẩn. Mặc định là false (ẩn).

Cú pháp

detailsObject.open = true|false

Ví dụ

Mở <details> bằng JavaScript:

<!DOCTYPE html> <html> <body> 
<h2>Details open property</h2> 
<details id="Details1"> 
  <summary>Tháp Eiffel</summary> 
  <p style="color:blue">Tháp Eiffel là tháp sắt rổn trên sân Chiến thần ở Paris, Pháp. Tên theo kỹ sư Gustave Eiffel.</p> 
</details> 
<p>Nhấn nút để hiển thị chi tiết</p> 
<button onclick="setDetail()">HIỂN THỊ</button> 
<script> 
  function setDetail() { 
    document.getElementById("Details1").open = true; 
  } 
</script> </body> </html>

Kết quả

Ban đầu <details> thu gọn:

Sau khi nhấn nút, nội dung mở ra: