HTML DOM head प्रॉपर्टी

HTML DOM head प्रॉपर्टी HTML <head> तत्व से जुड़ी होती है। इसका उपयोग <head> तत्व को लौटाने के लिए किया जाता है। यदि कई head तत्व हैं तो यह पहला head तत्व लौटाएगा। यह एक रीड-ओनली प्रॉपर्टी है।

सिंटैक्स

head प्रॉपर्टी के लिए सिंटैक्स:

document.head

उदाहरण

आइए HTML DOM head प्रॉपर्टी का एक उदाहरण देखते हैं:

<!DOCTYPE html> <html> <head> 
<title>मेरा शीर्षक</title> 
</head> <body> 
<h1>head प्रॉपर्टी उदाहरण</h1> 
<p>नीचे दिए गए बटन पर क्लिक करके इस दस्तावेज़ का शीर्षक प्राप्त करें</p> 
<button onclick="getTitle()">Get Title</button> 
<p id="Sample"></p> 
<script> 
  function getTitle() { 
    var x = document.head.firstElementChild.innerHTML; 
    document.getElementById("Sample").innerHTML = "इस दस्तावेज़ का शीर्षक है: " + x; 
  } 
</script> </body> </html>

आउटपुट

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

"Get Title" बटन पर क्लिक करने पर:

उदाहरण की व्याख्या

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

• हमने पहले एक <head> तत्व बनाया जिसमें इसके अंदर एक <title> तत्व है जो इस वेब पेज के लिए शीर्षक निर्दिष्ट करता है:

<head> <title>मेरा शीर्षक</title> </head>

• फिर हम एक बटन "Get Title" बनाते हैं जो यूज़र द्वारा क्लिक किए जाने पर getTitle() मेथड को एक्ज़िक्यूट करता है:

<button onclick="getTitle()">Get Title</button>

• getTitle() मेथड head तत्व प्राप्त करने के लिए document head प्रॉपर्टी का उपयोग करता है और इसके पहले चाइल्ड तत्व को प्राप्त करने के लिए firstElementChild प्रॉपर्टी का उपयोग करता है जो हमारे मामले में <title> तत्व है।
• फिर हम title तत्व पर innerHTML प्रॉपर्टी का उपयोग करके इसके अंदर का टेक्स्ट प्राप्त करते हैं और इसे id "Sample" वाले पैराग्राफ में इसकी innerHTML प्रॉपर्टी का उपयोग करके प्रदर्शित करते हैं:

function getTitle() { 
  var x = document.head.firstElementChild.innerHTML; 
  document.getElementById("Sample").innerHTML = "इस दस्तावेज़ का शीर्षक है: " + x; 
}