HTML DOM Details open প্রপার্টি HTML
সিনট্যাক্স
−
-এর সিনট্যাক্স নিচে দেওয়া হলবিস্তারিত খোলা সম্পত্তি সেট করা -
detailsObject.open = true|false
এখানে, true=Details দেখানো হবে এবং false=Details লুকানো হবে। বিশদ ডিফল্টরূপে লুকানো হয়৷
৷উদাহরণ
আসুন বিস্তারিত খোলা সম্পত্তি -
-এর জন্য একটি উদাহরণ দেখি<!DOCTYPE html>
<html>
<body>
<h2>Details open() property</h2>
<details id="Details1">
<summary>Eiffel Tower</summary>
<p style="color:blue">The Eiffel Tower is a wrought-iron lattice tower on the Champ de Mars in Paris, France.
It is named after the engineer Gustave Eiffel, whose company designed and built the tower. </p>
</details>
<p>Click the below button to set the details to be visible to the user</p>
<button onclick="setDetail()">Visible</button>
<script>
function setDetail() {
document.getElementById("Details1").open = true;
}
</script>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট −
তৈরি করবে

"দৃশ্যমান" বোতামে ক্লিক করলে -

উপরের উদাহরণে -
আমরা “Details1” আইডি সহ একটি <বিস্তারিত<উপাদান তৈরি করেছি এবং এতে <সারাংশ<এবং একটি
<details id="Details1"> <summary>Eiffel Tower</summary> <p style="color:blue">The Eiffel Tower is a wrought-iron lattice tower on the Champ de Mars in Paris, France. It is named after the engineer Gustave Eiffel, whose company designed and built the tower. </p> </details>
তারপরে আমরা "দৃশ্যমান" বোতামটি তৈরি করেছি যা ব্যবহারকারী দ্বারা ক্লিক করলে setDetail() ফাংশনটি কার্যকর করবে -
<button onclick="setDetail()">Visible</button>
setDetail() ফাংশন getElementById() ব্যবহার করে
function setDetail() {
document.getElementById("Details1").open = true;
}