एचटीएमएल डोम विवरण वस्तु

<घंटा/>

HTML DOM विवरण ऑब्जेक्ट HTML <विवरण> तत्व से संबद्ध है। यह हमें उस जानकारी को छिपाने की अनुमति दे सकता है जिसे केवल तभी प्रदर्शित किया जा सकता है जब उपयोगकर्ता इसे देखना चाहता है।

गुण

विवरण वस्तु के लिए संपत्ति निम्नलिखित है -

Sr.No	संपत्ति और विवरण
1	खुला यह सेट करने या वापस करने के लिए कि विवरण उपयोगकर्ता को दिखाई देना चाहिए या नहीं।

सिंटैक्स

−

. के लिए वाक्य रचना निम्नलिखित है

विवरण वस्तु बनाना -

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

उदाहरण

आइए HTML DOM विवरण ऑब्जेक्ट के लिए एक उदाहरण देखें -

<!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>

आउटपुट

यह निम्नलिखित आउटपुट देगा -

एचटीएमएल डोम विवरण वस्तु

क्रिएट बटन पर क्लिक करने पर और फिर एरो पर क्लिक करके डिटेल्स को एक्सपैंड करने पर -

एचटीएमएल डोम विवरण वस्तु

उपरोक्त उदाहरण में -

हमने एक बटन बनाया है जो उपयोगकर्ता द्वारा क्लिक किए जाने पर detCreate() फ़ंक्शन निष्पादित करेगा -

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

detCreate () फ़ंक्शन दस्तावेज़ ऑब्जेक्ट की createElement () विधि का उपयोग करके एक

तत्व बनाता है और इसे वेरिएबल et को असाइन करता है। फिर हम एक और तत्व <सारांश> बनाते हैं जो <विवरण> तत्व का एक हिस्सा है और इसके अंदर दस्तावेज़ ऑब्जेक्ट की createElement() विधि द्वारा निहित है और इसे चर योग को असाइन करता है।

फिर दो टेक्स्ट नोड्स sumtxt और txt बनाए जाते हैं जो क्रमशः

और

एलिमेंट से जुड़े होते हैं। नव निर्मित <सारांश> तत्व और विवरण तत्व को परिशिष्ट चाइल्ड () विधि का उपयोग करके दस्तावेज़ निकाय में जोड़ा जाता है और तत्वों को पैरामीटर के रूप में जोड़ा जाता है -

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);
}