JavaScript HTML DOM ਡੂਕੁਮੈਂਟ
- ਪਿਛਲਾ ਪੰਨਾ DOM ਮੇਥਡ
- ਅਗਲਾ ਪੰਨਾ DOM ਐਲੀਮੈਂਟ
HTML DOM ਦਸਤਾਵੇਜ਼ ਆਬਜੈਕਟ ਤੁਹਾਡੇ ਵੈੱਬਪੰਨੇ ਵਿੱਚ ਸਾਰੇ ਹੋਰ ਆਬਜੈਕਟਾਂ ਦੇ ਮਾਲਕ ਹੈ
HTML DOM Document ਆਬਜੈਕਟ
ਦਸਤਾਵੇਜ਼ ਆਬਜੈਕਟ
ਅਗਰ ਤੁਸੀਂ HTML ਪੰਨੇ ਵਿੱਚ ਕਿਸੇ ਪੁਰਜੇ ਨੂੰ ਦੇਖਣਾ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਹਮੇਸ਼ਾ document ਆਬਜੈਕਟ ਤੋਂ ਸ਼ੁਰੂ ਕਰਦੇ ਹੋ
ਹੇਠ ਲਿਖੇ ਹਨ document ਆਬਜੈਕਟ ਰਾਹੀਂ ਹੋਰ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦੇ ਇਸਤੇਮਾਲ ਦੇ ਉਦਾਹਰਣ
HTML ਪੁਰਜਾ ਲੱਭਣਾ
ਕਿਸਮ | ਵਰਣਨ |
---|---|
document.getElementById(id) | ਪੁਰਜਾ ਦੇ id ਰਾਹੀਂ ਪੁਰਜਾ ਲੱਭਣਾ |
document.getElementsByTagName(ਨਾਮ) | ਟੈਗ ਨਾਮ ਰਾਹੀਂ ਪੁਰਜਾ ਲੱਭਣਾ |
document.getElementsByClassName(ਨਾਮ) | ਕਲਾਸ ਨਾਮ ਰਾਹੀਂ ਪੁਰਜਾ ਲੱਭਣਾ |
HTML ਪੁਰਜਾ ਬਦਲਣਾ
ਕਿਸਮ | ਵਰਣਨ |
---|---|
element.innerHTML = ਨਵਾਂ html ਕੰਟੈਂਟ | ਪੁਰਜਾ ਦਾ inner HTML ਬਦਲਣਾ |
element.attribute = new value | HTML ਐਲੀਮੈਂਟ ਦੀ ਵਿਸ਼ੇਸ਼ਤਾ ਮੁੱਲ ਬਦਲੋ |
element.setAttribute(attribute, value) | HTML ਐਲੀਮੈਂਟ ਦੀ ਵਿਸ਼ੇਸ਼ਤਾ ਮੁੱਲ ਬਦਲੋ |
element.style.property = new style | HTML ਐਲੀਮੈਂਟ ਦੇ ਸਟਾਈਲ ਬਦਲੋ |
ਐਲੀਮੈਂਟ ਜੋੜੋ ਅਤੇ ਹਟਾਓ
ਕਿਸਮ | ਵਰਣਨ |
---|---|
document.createElement(element) | HTML ਐਲੀਮੈਂਟ ਬਣਾਓ |
document.removeChild(element) | HTML ਐਲੀਮੈਂਟ ਹਟਾਓ |
document.appendChild(element) | HTML ਐਲੀਮੈਂਟ ਜੋੜੋ |
document.replaceChild(element) | HTML ਐਲੀਮੈਂਟ ਬਦਲੋ |
document.write(text) | HTML ਆਉਟਪੁੱਟ ਸਟਰੀਮ ਲਿਖੋ |
ਈਵੈਂਟ ਹੈਂਡਲਰ ਜੋੜੋ
ਕਿਸਮ | ਵਰਣਨ |
---|---|
document.getElementById(id).onclick = function(){code} | onclick ਈਵੈਂਟ ਵਿੱਚ ਈਵੈਂਟ ਹੈਂਡਲਰ ਜੋੜੋ |
HTML ਵਸਤੂ ਲੱਭੋ
ਪਹਿਲਾ HTML DOM Level 1 (1998) ਵਿੱਚ 11 ਹੋਰ HTML ਵਸਤੂਆਂ, ਵਸਤੂ ਕੋਲੈਕਸ਼ਨਾਂ ਅਤੇ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਨਿਰਧਾਰਿਤ ਕੀਤੀਆਂ ਗਈਆਂ। ਉਹਨਾਂ ਹੁਣ ਵੀ HTML5 ਵਿੱਚ ਹਾਲੀ ਹਨ।
ਬਾਅਦ ਵਿੱਚ HTML DOM Level 3 ਵਿੱਚ ਹੋਰ ਵਸਤੂਆਂ, ਕੋਲੈਕਸ਼ਨਾਂ ਅਤੇ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਜੋੜੀਆਂ ਗਈਆਂ।
ਵਿਸ਼ੇਸ਼ਤਾ | ਵਰਣਨ | DOM |
---|---|---|
document.anchors | ਨਾਮ ਪ੍ਰਤੀਯੋਗੀ ਹੋਣ ਵਾਲੇ ਸਾਰੇ <a> ਐਲੀਮੈਂਟਾਂ ਨੂੰ ਵਾਪਸ ਕਰੋ | 1 |
document.applets | ਸਾਰੇ <applet> ਐਲੀਮੈਂਟਾਂ ਨੂੰ ਵਾਪਸ ਕਰੋ(HTML5 ਵਿੱਚ ਸਲਾਹ ਨਹੀਂ ਦਿੱਤੀ ਜਾਂਦੀ ਹੈ) | 1 |
document.baseURI | ਦਸਤਾਵੇਜ਼ ਦਾ ਸਥਾਨਕ ਬੇਸਿਨ URI ਵਾਪਸ ਕਰੋ | 3 |
document.body | <body> ਐਲੀਮੈਂਟ ਵਾਪਸ ਕਰੋ | 1 |
document.cookie | ਦਸਤਾਵੇਜ਼ ਦਾ cookie ਵਾਪਸ ਕਰੋ | 1 |
document.doctype | ਦਸਤਾਵੇਜ਼ ਦਾ doctype ਵਾਪਸ ਕਰੋ | 3 |
document.documentElement | <html> ਐਲੀਮੈਂਟ ਵਾਪਸ ਕਰੋ | 3 |
document.documentMode | ਬਰਾਉਜ਼ਰ ਵਲੋਂ ਵਰਤਿਆ ਜਾਣ ਵਾਲਾ ਮੋਡ ਵਾਪਸ ਕਰੋ | 3 |
document.documentURI | ਦਸਤਾਵੇਜ਼ ਦਾ URI ਵਾਪਸ ਕਰੋ | 3 |
document.domain | ਦਸਤਾਵੇਜ਼ ਸੇਵਾਕਰਤਾ ਦਾ ਨਾਮ ਵਾਪਸ ਕਰੋ | 1 |
document.domConfig | ਤਿਆਗ ਦਿੱਤਾ ਗਿਆDOM ਸੰਰਚਨਾ ਵਾਪਸ ਕਰੋ | 3 |
document.embeds | ਸਾਰੇ <embed> ਐਲੀਮੈਂਟਾਂ ਨੂੰ ਵਾਪਸ ਕਰੋ | 3 |
document.forms | ਸਾਰੇ <form> ਐਲੀਮੈਂਟ ਵਾਪਸ ਕਰੋ | 1 |
document.head | <head> ਐਲੀਮੈਂਟ ਵਾਪਸ ਕਰੋ | 3 |
document.images | ਸਾਰੇ <img> ਐਲੀਮੈਂਟ ਵਾਪਸ ਕਰੋ | 1 |
document.implementation | DOM ਇੰਪਲੀਮੈਂਟਸ ਵਾਪਸ ਕਰੋ | 3 |
document.inputEncoding | ਦਸਤਾਵੇਜ਼ ਦੀ ਇੰਪੁਟ ਇੰਕੋਡਿੰਗ (ਚਾਰੀਟਰ ਸੈੱਟ) ਵਾਪਸ ਕਰੋ | 3 |
document.lastModified | ਦਸਤਾਵੇਜ਼ ਦੀ ਅੱਪਡੇਟ ਮਿਤੀ ਅਤੇ ਸਮਾਂ ਵਾਪਸ ਕਰੋ | 3 |
document.links | ਸਾਰੇ <area> ਅਤੇ <a> ਐਲੀਮੈਂਟ ਨੂੰ ਵਾਪਸ ਕਰੋ ਜੋ ਹਰੇਕ ਲਿੰਕ ਹਵਾਲਾ ਕਰਦੇ ਹਨ | 1 |
document.readyState | ਦਸਤਾਵੇਜ਼ ਦੀ (ਲੋਡ) ਸਥਿਤੀ ਵਾਪਸ ਕਰੋ | 3 |
document.referrer | ਹਵਾਲਾ ਕੀਤੇ URI (ਲਿੰਕ ਦਸਤਾਵੇਜ਼) ਵਾਪਸ ਕਰੋ | 1 |
document.scripts | ਸਾਰੇ <script> ਐਲੀਮੈਂਟ ਵਾਪਸ ਕਰੋ | 3 |
document.strictErrorChecking | ਮਜ਼ਬੂਰੀ ਗਲਤੀ ਚੇਕ ਕਰਨ ਦੀ ਸਥਿਤੀ ਵਾਪਸ ਕਰੋ | 3 |
document.title | <title> ਐਲੀਮੈਂਟ ਵਾਪਸ ਕਰੋ | 1 |
document.URL | ਦਸਤਾਵੇਜ਼ ਦੀ ਪੂਰੀ URL ਵਾਪਸ ਕਰੋ | 1 |
- ਪਿਛਲਾ ਪੰਨਾ DOM ਮੇਥਡ
- ਅਗਲਾ ਪੰਨਾ DOM ਐਲੀਮੈਂਟ