HTML5
सिंटैक्स
−
. के लिए वाक्य रचना निम्नलिखित हैफिगकैप्शन ऑब्जेक्ट बनाना -
var p = document.createElement("FIGCAPTION"); उदाहरण
आइए Figcaption ऑब्जेक्ट के लिए एक उदाहरण देखें -
<!DOCTYPE html>
<html>
<head>
<script>
function createCaption() {
var caption = document.createElement("FIGCAPTION");
var txt = document.createTextNode("Learn Java Servlets");
caption.appendChild(txt);
var f=document.getElementById("Figure1");
f.appendChild(caption);
}
</script>
</head>
<body>
<h2>Caption</h2>
<p>Create a caption for the below image by clicking the below button</p>
<button onclick="createCaption()">CREATE</button>
<figure id="Figure1">
<img src="https://www.tutorialspoint.com/servlets/images/servlets-mini-logo.jpg"
alt="Servlets" width="250" height="200">
</figure>
</body>
</html> आउटपुट
यह निम्नलिखित आउटपुट देगा -
क्रिएट बटन पर क्लिक करने पर -
उपरोक्त उदाहरण में -
हमने पहले "चित्र 1" आईडी के साथ एक आकृति तत्व बनाया है और इसके अंदर एक आईएमजी तत्व है -
<figure id="Figure1"> <img src="EiffelTower.jpg" alt="Eiffel Tower" width="250" height="200"> </figure>
फिर हम एक बटन बनाते हैं CREATE() जो उपयोगकर्ता द्वारा क्लिक किए जाने पर createCaption() विधि को निष्पादित करेगा -
<button onclick="createCaption()">CREATE</button>
createCaption() विधि दस्तावेज़ ऑब्जेक्ट की createElement() विधि का उपयोग करके एक figcaption तत्व बनाता है। दस्तावेज़ निकाय की createTextNode () विधि का उपयोग करके एक टेक्स्ट नोड बनाया जाता है और इसे figcaption तत्व में जोड़ा जाता है। फिर हम getElementById () विधि का उपयोग करके फिगर एलिमेंट प्राप्त करते हैं और एपेंड चाइल्ड () विधि का उपयोग करके टेक्स्ट नोड के साथ फिगकैप्शन को चाइल्ड एलिमेंट के रूप में जोड़ते हैं -
function createCaption() {
var caption = document.createElement("FIGCAPTION");
var txt = document.createTextNode("Eiffel Tower in Paris,France");
caption.appendChild(txt);
var f=document.getElementById("Figure1");
f.appendChild(caption);
}