जावास्क्रिप्ट एचटीएमएल डोम दस्तावेज़
HTML DOM दस्तावेज़ ऑब्जेक्ट आपके वेब पेज में अन्य सभी ऑब्जेक्ट का स्वामी है।
HTML DOM दस्तावेज़ ऑब्जेक्ट
दस्तावेज़ ऑब्जेक्ट आपके वेब पेज का प्रतिनिधित्व करता है।
यदि आप किसी HTML पृष्ठ में किसी भी तत्व तक पहुँच प्राप्त करना चाहते हैं, तो आप हमेशा दस्तावेज़ वस्तु तक पहुँचने के साथ शुरू करते हैं।
HTML तक पहुँचने और उसमें हेरफेर करने के लिए आप दस्तावेज़ ऑब्जेक्ट का उपयोग कैसे कर सकते हैं, इसके कुछ उदाहरण नीचे दिए गए हैं।
HTML तत्वों को ढूँढना
| Method | Description |
|---|---|
| document.getElementById(id) | Find an element by element id |
| document.getElementsByTagName(name) | Find elements by tag name |
| document.getElementsByClassName(name) | Find elements by class name |
HTML तत्वों को बदलना
| Property | Description |
|---|---|
| element.innerHTML = new html content | Change the inner HTML of an element |
| element.attribute = new value | Change the attribute value of an HTML element |
| element.style.property = new style | Change the style of an HTML element |
| Method | Description |
| element.setAttribute(attribute, value) | Change the attribute value of an HTML element |
तत्वों को जोड़ना और हटाना
| Method | Description |
|---|---|
| document.createElement(element) | Create an HTML element |
| document.removeChild(element) | Remove an HTML element |
| document.appendChild(element) | Add an HTML element |
| document.replaceChild(new, old) | Replace an HTML element |
| document.write(text) | Write into the HTML output stream |
ईवेंट हैंडलर्स जोड़ना
| Method | Description |
|---|---|
| document.getElementById(id).onclick = function(){code} | Adding event handler code to an onclick event |
HTML ऑब्जेक्ट ढूँढना
पहला HTML DOM लेवल 1 (1998), 11 HTML ऑब्जेक्ट्स, ऑब्जेक्ट कलेक्शन और प्रॉपर्टीज को परिभाषित करता है। ये अभी भी HTML5 में मान्य हैं।
बाद में, HTML DOM स्तर 3 में, अधिक ऑब्जेक्ट, संग्रह और गुण जोड़े गए।
| Property | Description | DOM |
|---|---|---|
| document.anchors | Returns all <a> elements that have a name attribute | 1 |
| document.applets | Deprecated | 1 |
| document.baseURI | Returns the absolute base URI of the document | 3 |
| document.body | Returns the <body> element | 1 |
| document.cookie | Returns the document's cookie | 1 |
| document.doctype | Returns the document's doctype | 3 |
| document.documentElement | Returns the <html> element | 3 |
| document.documentMode | Returns the mode used by the browser | 3 |
| document.documentURI | Returns the URI of the document | 3 |
| document.domain | Returns the domain name of the document server | 1 |
| document.domConfig | Obsolete. | 3 |
| document.embeds | Returns all <embed> elements | 3 |
| document.forms | Returns all <form> elements | 1 |
| document.head | Returns the <head> element | 3 |
| document.images | Returns all <img> elements | 1 |
| document.implementation | Returns the DOM implementation | 3 |
| document.inputEncoding | Returns the document's encoding (character set) | 3 |
| document.lastModified | Returns the date and time the document was updated | 3 |
| document.links | Returns all <area> and <a> elements that have a href attribute | 1 |
| document.readyState | Returns the (loading) status of the document | 3 |
| document.referrer | Returns the URI of the referrer (the linking document) | 1 |
| document.scripts | Returns all <script> elements | 3 |
| document.strictErrorChecking | Returns if error checking is enforced | 3 |
| document.title | Returns the <title> element | 1 |
| document.URL | Returns the complete URL of the document | 1 |