Heim >Web-Frontend >js-Tutorial >Zusammenfassung von JavaScript: Dom erhält Sammlungselementobjekte

Zusammenfassung von JavaScript: Dom erhält Sammlungselementobjekte

WBOY
WBOYnach vorne
2022-08-05 16:09:201599Durchsuche

Dieser Artikel vermittelt Ihnen relevantes Wissen über Javascript. Er stellt hauptsächlich die damit verbundenen Probleme beim Abrufen von Sammlungselementobjekten dar. Sie können for- oder for...of-Schleifen verwenden, um die Elementobjekte in der Sammlung zu steuern Schauen Sie sich die folgenden Eigenschaften und Methoden an. Ich hoffe, dass sie für alle hilfreich sind.

Zusammenfassung von JavaScript: Dom erhält Sammlungselementobjekte

【Verwandte Empfehlungen: Javascript-Video-Tutorial, Web-Frontend

Rufen Sie das Elementobjekt in der Sammlung ab

Eine Knotensammlung ist eine Sammlung von Knoten (Index beginnt bei 0)

Verwenden for oder for ...of-SchleifeDurchläuft die Elementobjekte in der Sammlung, um deren Eigenschaften und Methoden zu manipulieren.

Eigenschaften und Methoden Einfache Beschreibung
Länge Die Anzahl der Elementobjekte in der Knotensammlung
[n] oder Element(n) Gibt das einzelne Elementobjekt zurück, das dem Index entspricht n
//在if条件表达式中写出:orderCheckbox元素对象集合中的元素节点的个数大于0
if(orderCheckboxs.length>0) {
  // 使用普通的for循环迭代orderCheckboxs元素对象集合中的每个元素对象
  for(let i=0;i<orderCheckboxs.length;i++){
    // 在.前面用item(n)方式获取元素对象集合的元素对象。
    orderCheckboxs.item(i).checked= true;
    // 在.前面用[]方式获取元素对象集合的元素对象。
    orderCheckboxs[i].parentElement.className= &#39;item-selected&#39;;
  }
//用一下箭头函数哈
selectAll.onchange= (e) => {
  // 下面的语句是循环体,使用for…of循环迭代orderCheckboxs元素对象集合,循环变量是ele
  for(let ele of orderCheckboxs){
      ele.checked= e.target.checked;
      if(e.target.checked) {
        ele.parentElement.classList.add('item-selected');
      } else {
        ele.parentElement.classList.remove('item-selected');
      }
  }
};

Es wird allgemein empfohlen, die for..of-Schleife zu verwenden

***** Verstehen Sie die folgenden zwei Methoden zum Abrufen einer Sammlung von Elementobjekten.
document(or element).getElementsByClassName('class value')

Gibt eine Sammlung aller Elementobjekte zurück, deren Klassenattribut der Parameter in den Nachkommen des Dokumentfeuerelements ist. Der Parameter kann nur der Wert des Klassenattributs des HTML-Elements sein (d. h. der Klassenname).

document(or element).getElementsByTagName('tag name')

Gibt eine Sammlung aller Elementobjekte mit dem Tag-Namen-Parameter im Dokument oder den Elementnachkommen zurück. Parameter können nur Tag-Namen von HTML-Elementen sein.

const orders= document.getElementsByClassName('order');
const input= document.getElementsByTagName('input');

Das Durchlaufen von Knoten

behandelt Leerzeichen-Textknoten als untergeordnete Knoten, mit Ausnahme von parentNode. Geben Sie null zurück

Gibt den übergeordneten Knoten des aktuellen Knotens zurück.firstChildGibt den ersten untergeordneten Knoten des aktuellen Knotens zurück.lastChild.Gibt den letzten untergeordneten Knoten des aktuellen Knotens zurück Retouren das nächste untergeordnete Element des aktuellen Knotens. Ein Geschwisterknoten.Gibt den vorherigen Geschwisterknoten des aktuellen Knotens zurück Nur Elementknoten durchqueren (Text usw. ignorieren) Knoten), nicht gefunden ist nullSchreibgeschützte EigenschaftparentElement firstElementChild
previousSibling
Description
Gibt den übergeordneten Elementknoten des Elements zurück
Gibt den ersten untergeordneten Elementknoten des Elements zurück.

lastElementChild

Gibt den letzten untergeordneten Elementknoten des Elements zurück.

nextElementSibling GeschwisterGibt den vorherigen Geschwisterelementknoten des Elements zurück

Das obige ist der detaillierte Inhalt vonZusammenfassung von JavaScript: Dom erhält Sammlungselementobjekte. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen