HTML DOM Element children ਪ੍ਰਤੀਯੋਗਿਤਾ

ਵਿਆਖਿਆ ਅਤੇ ਵਰਤੋਂ

children ਪ੍ਰਤੀਯੋਗਿਤਾ ਤੱਤ ਦੇ ਉੱਪ ਤੱਤ ਕਲੈਕਸ਼ਨ ਵਾਪਸ ਕਰਦੀ ਹੈ

children ਪ੍ਰਤੀਯੋਗਿਤਾ HTMLCollection ਆਬਜੈਕਟ ਵਾਪਸ ਕਰਦੀ ਹੈ

ਹੋਰ ਦੇਖੋ:

firstElementChild ਪ੍ਰਤੀਯੋਗਿਤਾ

lastElementChild ਪ੍ਰਤੀਯੋਗਿਤਾ

nextElementSibling ਪ੍ਰਤੀਯੋਗਿਤਾ

previousElementSibling ਪ੍ਰਤੀਯੋਗਿਤਾ

childElementCount ਪ੍ਰਤੀਯੋਗਿਤਾ

childNodes ਪ੍ਰਤੀਯੋਗਿਤਾ

HTML ਨੋਡ ਅਤੇ ਤੱਤ

ਵਿੱਚ HTML DOMDOM (ਦਸਤਾਵੇਜ਼ ਆਬਜੈਕਟ ਮਾਡਲ) ਵਿੱਚ, HTML ਦਸਤਾਵੇਜ਼ ਉੱਪ ਨੋਡ ਵਾਲੇ ਨੋਡ ਕਲੈਕਸ਼ਨ ਹੈ (ਜਾਂ ਨਹੀਂ ਵਾਲੇ ਉੱਪ ਨੋਡ)

ਨੋਡਇਹ ਤੱਤ ਨੋਡ, ਟੈਕਸਟ ਨੋਡ ਅਤੇ ਨੋਟ ਨੋਡ ਦਾ ਮਤਲਬ ਹੈ

ਤੱਤਵਿੱਚ ਖਾਲੀ ਜਗ੍ਹਾ ਵੀ ਟੈਕਸਟ ਨੋਡ ਹੁੰਦੀ ਹੈ

ਜਦੋਂ ਤੱਤ ਸਿਰਫ ਤੱਤ ਨੋਡ ਹੈ

ਉੱਪ ਨੋਡ ਅਤੇ ਉੱਪ ਤੱਤ

childNodes ਵਾਪਸ ਕਰਦਾ ਹੈਉੱਪ ਨੋਡਨੋਡ ਨੋਡ, ਟੈਕਸਟ ਨੋਡ ਅਤੇ ਨੋਟ ਨੋਡ)。

children ਵਾਪਸ ਕਰਦਾ ਹੈਉੱਪ ਨੋਡਨਹੀਂ ਟੈਕਸਟ ਅਤੇ ਨੋਟ ਨੋਡ)。

ਸਾਥੀ ਅਤੇ ਤੱਤ ਸਾਥੀ

ਸਾਥੀਭਾਈ ਅਤੇ ਭੈਣ

ਸਾਥੀਹਰੇਕ ਉਪ ਇਲੈਕਟ੍ਰੌਨ ਦੇ ਨਾਲ ਮਿਲਦਾ ਨੋਡ (ਮੌਜੂਦਾ ਮਿਲਦਾ ਹੈ) childNodes ਸੂਚੀ ਵਿੱਚ)。

ਇਲੈਕਟ੍ਰੌਨ ਸਾਥੀਹਰੇਕ ਉਪ ਇਲੈਕਟ੍ਰੌਨ ਦੇ ਨਾਲ ਮਿਲਦਾ ਇਲੈਕਟ੍ਰੌਨ (ਮੌਜੂਦਾ ਮਿਲਦਾ ਹੈ) children ਸੂਚੀ ਵਿੱਚ)。

ਉਦਾਹਰਣ

ਉਦਾਹਰਣ 1

<body> ਇਲੈਕਟ੍ਰੌਨ ਦੇ ਉਪ ਇਲੈਕਟ੍ਰੌਨ ਦੀ ਕਲੈਕਸ਼ਨ ਪ੍ਰਾਪਤ ਕਰੋ:

const collection = document.body.children;

ਆਪਣੇ ਆਪ ਦੀ ਜਾਇਜ਼ੀ ਕਰੋ

ਉਦਾਹਰਣ 2

"myDIV" ਵਿੱਚ ਕਿੰਨੇ ਉਪ ਇਲੈਕਟ੍ਰੌਨ ਹਨ:

let count = document.getElementById("myDIV").children.length;

ਆਪਣੇ ਆਪ ਦੀ ਜਾਇਜ਼ੀ ਕਰੋ

ਉਦਾਹਰਣ 3

"myDIV" ਦੇ ਦੂਜੇ ਉਪ ਇਲੈਕਟ੍ਰੌਨ ਦਾ ਪੱਚਾ ਬਦਲੋ:

const collection = document.getElementById("myDIV").children;
collection[1].style.backgroundColor = "yellow";

ਆਪਣੇ ਆਪ ਦੀ ਜਾਇਜ਼ੀ ਕਰੋ

ਉਦਾਹਰਣ 4

<select> ਇਲੈਕਟ੍ਰੌਨ ਦੇ ਤੀਜੇ ਉਪ ਇਲੈਕਟ੍ਰੌਨ (ਇੰਡੈਕਸ 2) ਦਾ ਪਾਠ ਪ੍ਰਾਪਤ ਕਰੋ:

const collection = document.getElementById("mySelect").children[2].text;

ਆਪਣੇ ਆਪ ਦੀ ਜਾਇਜ਼ੀ ਕਰੋ

ਉਦਾਹਰਣ 5

ਪੂਰੇ <body> ਦੇ ਸਾਰੇ ਉਪ ਇਲੈਕਟ੍ਰੌਨਾਂ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰੋ ਅਤੇ ਉਨ੍ਹਾਂ ਦਾ ਪੱਚਾ ਬਦਲੋ:

const collection = document.body.children;
for (let i = 0; i < collecton.length; i++) {
  collection[i].style.backgroundColor = "red";
}

ਆਪਣੇ ਆਪ ਦੀ ਜਾਇਜ਼ੀ ਕਰੋ

ਗਣਨਾ

element.children

ਵਾਪਸ ਮੁੱਲ

ਕਿਸਮ ਵਰਣਨ
ਆਬਜੈਕਟ

HTMLCollection ਆਬਜੈਕਟ

ਇਲੈਕਟ੍ਰੌਨ ਨੋਡ ਦੀ ਕਲੈਕਸ਼ਨ

ਇਲੈਕਟ੍ਰੌਨ ਦਾ ਕਿਸਮ ਉਸ ਦੇ ਪਾਠ ਵਿੱਚ ਮੌਜੂਦ ਹੋਣ ਉੱਤੇ ਤੈਅ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。

ਬਰਾਊਜ਼ਰ ਸਮਰਥਨ

element.children ਇਹ DOM Level 1 (1998) ਵਿਸ਼ੇਸ਼ਤਾ ਹੈ。

ਸਾਰੇ ਬਰਾਊਜ਼ਰ ਇਸ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਕਰਦੇ ਹਨ:

ਚਰਮੋਕ ਆਈਈ ਐਜ਼ਡ ਫਾਇਰਫਾਕਸ ਸੈਫਾਰੀ ਓਪਰਾ
ਚਰਮੋਕ ਆਈਈ ਐਜ਼ਡ ਫਾਇਰਫਾਕਸ ਸੈਫਾਰੀ ਓਪਰਾ
ਸਮਰਥਨ 9-11 ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ