JavaScript-Methode zum direkten Abrufen von Elementen über Element-ID- und Name_Javascript-Kenntnisse

Das Beispiel in diesem Artikel beschreibt, wie JavaScript Elemente direkt über die Element-ID und den Namen abrufen kann. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Wir wissen, dass einige js-Bibliotheken von Drittanbietern einige Vereinfachungen für die schnelle Auswahl von Elementen in HTML vorgenommen haben. Sie scheinen sehr mysteriös zu sein, sind es aber tatsächlich nicht. Darüber hinaus verfügt js selbst über eine einfache Methode zur Auswahl spezieller Elemente, die ich im Folgenden kurz vorstellen werde.

In HTML sind HTML-Elemente im Allgemeinen die Namens- und ID-Attribute, die sich leicht unterscheiden, der direkteste Weg, HTML-Elemente zu identifizieren: Die ID muss für die Seite eindeutig sein, der Name kann jedoch wiederholt werden.

Wenn in js der ID-Name nicht denselben Namen wie ein integriertes Attribut oder eine globale Variable hat, wird der Name automatisch zu einem Attribut des Fensterobjekts, und in der Umgebung der obersten Ebene einer HTML-Seite ist dies der Fall :

this === window

Wenn wir also einen HTML-Elementcode wie den folgenden schreiben, können wir ihn wie folgt referenzieren:

<input type="button" id="btn_ok" value="Ok" onclick="..." />
//可以这样引用
btn_ok.onclick = function(){};
//或者下面也是一样的
window.btn_ok.style = ...;

Für das Namensattribut verfügen nur bestimmte Arten von HTML-Elementen über ähnliche Methoden, z. B.: Formular, IMG, IFrame, Applet, Einbettung, Objekt usw. In diesen Elementen kann über globale Variablen oder Dokumentattribute auf Elemente mit bestimmten Namensattributen zugegriffen werden. Wenn mehrere Elemente mit demselben Namensattribut vorhanden sind, wird ein NodeList-ähnliches schreibgeschütztes Array-Objekt zurückgegeben, z. B. der folgende Code:

<div>
  <img name="pic" src="#" alt="pic_0" />
  <img name="pic" src="#" alt="pic_1" />
  <img name="pic" src="#" alt="pic_2" />
</div>
//我们可以这样引用name为pic的元素：
for(x in pic)
 console.log(pic[x].alt);
//或者是非"标准"语法each语句方式
for each(img in pic)
 console.log(img.alt);

Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.