DOM Nodelist ﺖﭙﯾﺮﮑﺳﺍ ﺍﻭﺎﺟ

فهرست مطالب

نمایش فهرست مطالب

HTML DOM NodeList ءﯽﺷ

ﮏﯾ ﺯﺍ ﻪﮐ ﺖﺳﺍ ﯽﯾﺎﻫﻩﺮﮔ (ﻪﻋﻮﻤﺠﻣ) ﺖﺴﯿﻟ NodeList ﯽﺷ

.ﺖﺳﺍ HTMLCollection ءﯽﺷ ﮏﯾ ﻪﺑﺎﺸﻣ ﺎًﺒﯾﺮﻘﺗ

ﺪﻨﻧﺍﺩﺮﮔﯽﻣﺮﺑ HTMLCollection ﯼﺎﺟ ﻪﺑ ﺍﺭ NodeList ﯽﺷ ﮏﯾ (ﺮﺗﯽﻤﯾﺪﻗ) ﺎﻫﺮﮔﺭﻭﺮﻣ ﺯﺍ ﯽ

.ﺪﻨﻧﺍﺩﺮﮔﯽﻣﺮﺑ childNodes ﯽﮔﮋﯾﻭ ﯼﺍﺮﺑ ﺍﺭ NodeList

.ﺪﻨﻧﺍﺩﺮﮔﯽﻣﺮﺑ querySelectorAll() ﺵﻭﺭ ﯼﺍﺮﺑ ﺍﺭ Nod

:ﺪﻨﮐ ﯽﻣ ﺏﺎﺨﺘﻧﺍ ﺪﻨﺳ ﮏﯾ ﺭﺩ ﺍﺭ <p> ﯼﺎﻫ ﻩﺮﮔ ﻡﺎﻤﺗ ﺮﯾﺯ ﺪﮐ

`ﻝﺎﺜﻣ`

const myNodeList = document.querySelectorAll("p");

.ﺪﻨﺘﺴﻫ ﯽﺳﺮﺘﺳﺩ ﻞﺑﺎﻗ ﺺﺧﺎﺷ ﻩﺭﺎﻤﺷ ﮏﯾ ﺎﺑ NodeList ﺭﺩ ﺩﻮﺟﻮﻣ ﺮﺻﺎﻨﻋ

ﻪﺑ ﯽﺳﺮﺘﺳﺩ ﯼﺍﺮﺑ

myNodeList[1]

ﻪﺟﻮﺗ: ﺩﻮﺷ ﯽﻣ ﻉﻭﺮﺷ 0 ﺯﺍ ﺺﺧﺎﺷ.

`HTML DOM ﻩﺮﮔ ﺖﺴﯿﻟ ﻝﻮﻃ`

:ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺎﻫ ﻩﺮﮔ ﺖﺴﯿﻟ ﺭﺩ ﺍﺭ ﺎﻫ ﻩﺮﮔ ﺩﺍﺪﻌﺗ length

`ﻝﺎﺜﻣ`

myNodelist.length

.ﺪﯿﻧﺰﺑ ﻪﻘﻠﺣ ﻩﺮﮔ ﮏﯾ ﯼﺎﻫﻩﺮﮔ ﻥﺎﯿﻣ ﺯﺍ ﺪﯿﻫﺍﻮﺧﯽﻣ ﻪﮐ ﺖﺳﺍ ﺪﯿﻔﻣ ﯽﻧﺎﻣﺯ

`ﻝﺎﺜﻣ`

ﺪﯿﻫﺩ ﺮﯿﯿﻐﺗ ﺍﺭ ﻩﺮﮔ ﮏﯾ ﺭﺩ <p> ﺮﺻﺎﻨﻋ ﻡﺎﻤﺗ ﮓﻧﺭ

const myNodelist = document.querySelectorAll("p");
for (let i = 0; i < myNodelist.length; i++) {
  myNodelist[i].style.color = "red";
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript HTML DOM</h2>

<p>Hello World!</p>

<p>Hello Norway!</p>

<p>Click the button to change the color of all p elements.</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
  const myNodelist = document.querySelectorAll("p");
  for (let i = 0; i < myNodelist.length; i++) {
    myNodelist[i].style.color = "red";
  }
}
</script>

</body>
</html>

`NodeList ﻭ HTMLCollection ﻦﯿﺑ ﺕﻭﺎﻔﺗ`

.ﺖﺳﺍ ﻥﺎﺴﮑﯾ ﺎًﺒﯾﺮﻘﺗ HTMLcollection ﮏﯾ ﻭ NodeList ﮏﯾ

ﺪﻧﺍ ﻩﺪﺷ ﺝﺍﺮﺨﺘﺳﺍ a ﺯﺍ ﻪﮐ ﺪﻨﺘﺴﻫ (ﺮﺻﺎﻨﻋ) ﺎﻫ ﻩﺮﮔ (ﺖﺳﺮﻬﻓ) ﺪﻨﻧﺎﻣ ﻪﯾﺍﺭﺁ ﻪﻋﻮﻤﺠﻣ ﻭﺩ ﺮﻫ

.ﺪﻧﺍﺩﺮﮔ ﯽﻣﺮﺑ ﺍﺭ (ﻪﻋﻮﻤﺠﻣ) ﺖﺴﯿﻟ ﺭﺩ ﺩﻮﺟﻮﻣ ﺮﺻﺎﻨﻋ ﺩﺍﺪﻌﺗ ﻪﮐ ﺪﻨﺘﺴﻫ length ﯽﮔﮋﯾﻭ ﯼﺍﺭﺍﺩ

HTMLCollection ﺯﺍ ﯼﺍ ﻪﻋﻮﻤﺠﻣ ﺪﻨﺳ ﺮﺻﺎﻨﻋ ﺖﺳﺍ.

NodeList ﻪﻋﻮﻤﺠﻣﺯﺍ ﯼﺍ ﻩﺮﮔﺪﻨﺳ ﯼﺎﻫ (ﻩﺮﮔﻩﺮﮔ ،ﺮﺼﻨﻋ ﯼﺎﻫﻩﺮﮔ ﻭ ﯽﮔﮋ

.ﺩﺍﺩ ﺭﺍﺮﻗ ﺱﺮﺘﺳﺩ ﺭﺩ ﺎﻬﻧﺁ ﺖﺳﺮﻬﻓ ﻩﺭﺎﻤﺷ ﺎﯾ ﻪﺳﺎﻨﺷ ،ﻡﺎﻧ ﺎﺑ ﻥﺍﻮﺗ ﯽﻣ ﺍﺭ HTMLCollection ﯼﺎﻫ ﻢﺘ

.ﺖﺳﺍ ﯽﺳﺮﺘﺳﺩ ﻞﺑﺎﻗ ﺎﻬﻧﺁ ﺖﺳﺮﻬﻓ ﻩﺭﺎﻤﺷ ﺎﺑ ﻂﻘﻓ NodeList ﺩﺭﺍﻮﻣ

.ﺩﺮﮐ ﺪﻫﺍﻮﺧ ﺮﯿﯿﻐﺗ ﺰﯿﻧ HTMLCollection ﺭﺩ ﺩﻮﺟﻮﻣ ﺖﺴﯿﻟ ،ﺪﯿﻨﮐ ﻪﻓﺎﺿﺍ DOM ﺭﺩ ﯽﺘﺴﯿﻟ ﻪﺑ ﺍﺭ

NodeList ﻪﻋﻮﻤﺠﻣ ﮏﯾ ﺐﻠﻏﺍ ﺎﺘﺴﯾﺍ ﺮﺼﻨﻋ ﮏﯾ ﺮﮔﺍ :ﻝﺎﺜﻣ .ﺖﺳﺍ

 ﺭﺩ ﯽﺘﺴﯿﻟ ﻪﺑ ﺍﺭ DOM ﺭ
getElementsByClassName() ﻭ 
.ﺪﻧﺍﺩﺮﮔﯽﻣﺮﺑ ﺍﺭ ﺖﺑﺎﺛ NodeList ﮏﯾ querySelectorAll()
.ﺪﻧﺍﺩﺮﮔﯽﻣﺮﺑ ﺍﺭ ﻩﺪﻧﺯ NodeList ﮏﯾ childNodes ﯽﮔﮋﯾ
                                                                          !ﺖﺴﯿﻧ ﻪﯾﺍﺭﺁ
                     .ﺖﺴﯿﻧ ﺭﻮﻄﻨﯾﺍ ﺎﻣﺍ ،ﺪﺳﺮﺑ ﺮﻈﻧ ﻪﺑ ﻪﯾﺍﺭﺁ ﮏﯾ ﻪﯿﺒﺷ ﺖﺳﺍ ﻦﮑﻤﻣ NodeList ﮏﯾ
  .ﺪﯿﻨﮐ ﻪﻌﺟﺍﺮﻣ ﺺﺧﺎﺷ ﺱﺎﺳﺍ ﺮﺑ ﻥﺁ ﯼﺎﻫ ﻩﺮﮔ ﻪﺑ ﻭ ﺪﯿﻧﺰﺑ ﻪﻘﻠﺣ NodeList ﻖﯾﺮﻃ ﺯﺍ ﺪﯿﻧﺍﻮﺗ ﯽﻣ ﺎﻤﺷ
.ﺪﯿﻨﮐ ﻩﺩﺎﻔﺘﺳﺍ NodeList ﺭﺩ()join ﺎﯾ()push()، pop ﺪﻨﻧﺎﻣ ﻪﯾﺍﺭﺁ ﯼﺎﻫ ﺵﻭﺭ ﺯﺍ ﺪﯿﻧﺍﻮﺗ ﯽﻤﻧ ﺎ

  
    
      ← صفحه قبلی
    
    
      صفحه بعد →