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

सिंटैक्स

फिगर ऑब्जेक्ट बनाने के लिए सिंटैक्स निम्नलिखित है -

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

उदाहरण

आप निम्न प्रकार से चित्र वस्तु बना सकते हैं -

  <हेड> <स्क्रिप्ट> फंक्शन क्रिएटफिगर () { var fig =document.createElement ("फिगर"); fig.setAttribute ("आईडी", "चित्रा 1"); document.body.appendChild(अंजीर); var i =document.createElement("IMG"); i.setAttribute ("src", "https://www.tutorialspoint.com/servlets/images/servletsmini-logo.jpg"); i.setAttribute ("चौड़ाई", "250"); i.setAttribute ("ऊंचाई", "200"); i.setAttribute ("alt", "एफिल टॉवर"); fig.appendChild(i); }
HTML DOM फिगर ऑब्जेक्ट
CREATE

 
आउटपुट
 

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

 
 

 क्रिएट बटन पर क्लिक करने पर -
 

 
 

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

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

 

 क्रिएटफिगर () फंक्शन डॉक्यूमेंट ऑब्जेक्ट के createElement () मेथड का उपयोग करके फिगर एलिमेंट बनाता है। setAttribute () का उपयोग करके, हम फिगर एलिमेंट की आईडी सेट करते हैं और अंत में इसे एपेंडचाइल्ड () विधि का उपयोग करके दस्तावेज़ के शरीर में जोड़ देते हैं। फिर हम इमेज एलिमेंट के अंदर इमेज डालने के लिए एक और एलीमेंट img बनाते हैं।
 

 setAttribute() विधि का उपयोग करके हम img तत्व src, चौड़ाई, ऊंचाई और alt मान सेट करते हैं। अंत में img एलिमेंट को एपेंड चाइल्ड () मेथड का उपयोग करके फिगर एलिमेंट के चाइल्ड के रूप में जोड़ा जाता है -
 
फ़ंक्शन क्रिएटफिगर(){ var fig =document.createElement("FIGURE"); fig.setAttribute ("आईडी", "चित्रा 1"); document.body.appendChild(अंजीर); var i =document.createElement("IMG"); i.setAttribute ("src", "EiffelTower.jpg"); i.setAttribute ("चौड़ाई", "250"); i.setAttribute ("ऊंचाई", "200"); i.setAttribute ("alt", "एफिल टॉवर"); fig.appendChild(i);}