Was bedeutet Javascript-Selektor?

In JavaScript sind Selektoren Methoden zum Abrufen von HTML-Seitenelementen. Sie können Seitenelemente in einem Objekt speichern und entsprechende Vorgänge für die Attributwerte dieses Objekts ausführen, z. B. „getElementById()“, „getElementsByName(“. )" "Warten.

Die Betriebsumgebung dieses Tutorials: Windows 10-System, JavaScript-Version 1.8.5, Dell G3-Computer.

Was bedeutet Javascript-Selektor?

JS-Selektor wird hauptsächlich verwendet, um die Elemente auf der HTML-Seite abzurufen, die Elemente auf der Seite in einem Objekt zu speichern und dann entsprechende Operationen an den Attributwerten dieser Objekte auszuführen um einige dynamische Effekte zu erzielen, um die Seite lebendig und benutzerfreundlich zu gestalten. Zu beachten ist, dass die Operation ein Objekt sein muss. Es ist nicht möglich, Elemente direkt als Objekte zu verwenden.

Der JS-Selektor bedient direkt die Attribute des Elements, das dem Objekt entspricht, sodass der Wert des von ihm geänderten Stils den Interline-Stil direkt ändert. Die Priorität ist viel höher als beim CSS-Stil. Daher sollten Sie bei der Verwendung darauf achten zur fertigen CSS-Stilauswahl.

Es gibt hauptsächlich vier Arten von nativen Selektoren in js

1. document.getElementById()
2. document.getElementsByClassName()
3. document.getElementsByName()
4. document.getElementsByTagName()

Als nächstes werde ich Stellen Sie kurz die grundlegende Verwendung mehrerer Selektoren vor. 1.document.getElementById () Auf diese Weise können Sie ein Elementobjekt aus HTML abrufen und damit arbeiten. 2.document.getElementsByClassName() Es ist ein Objekt, das einem Array ähnelt. Wenn Sie ein bestimmtes Elementobjekt auswählen müssen, müssen Sie einen Vorgang ausführen, der dem Array-Element ähnelt, wie folgt (am Beispiel des ersten Elements):

	<p>这是一个p标签</p>

Auf diese Weise , können Sie zu einem bestimmten Elementobjekt wechseln, wie in der Abbildung gezeigt:

Auf diese Weise können Sie bestimmte Vorgänge für dieses Elementobjekt ausführen

3.document.getElementsByTagName()

TagName-Selektor

Holen Sie sich das Objekt durch der Elementname

HTML-Teil

	var d1 = document.getElementById("p1")

JS-Teil

	<p>这是一个p标签</p>
    
这是一个p标签
    这是一个a标签
    这是一个span标签

Das Bild zeigt den erhaltenen Inhalt:

Der vom TagName-Selektor erhaltene Inhalt ist derselbe wie der ClassName-Selektor, bei dem es sich bei Bedarf um ein HTMLCollection-Objekt handelt Um ein bestimmtes Elementobjekt auszuwählen, müssen Sie auch etwas Ähnliches tun. Der Vorgang zum Abrufen der Array-Elemente ist wie folgt (am Beispiel des ersten Elements):

	var c1 = document.getElementsByClassName("c1")

Auf diese Weise können Sie ein bestimmtes Elementobjekt abrufen, z In der Abbildung dargestellt:

4.document.getElementsByName() Name Der Selektor
erhält das Objekt über das Name-Attribut

Der HTML-Teil

 	var c1 =  document.getElementsByClassName("p1")[0]

JS-Teil

        
• 0
        
• 1
        
• 2
        
• 3
        
• 4
    

Das Bild zeigt den erhaltenen Inhalt:

Der Namensselektor wird hauptsächlich zum Abrufen des Formular-Tags und anderer Tags verwendet, die das Namensattribut erfordern. Dieser Objekttyp ähnelt einem HTMLCollection-Objekt. Die abzurufende spezifische Objektoperation ähnelt einem Array. wie folgt:

	var li = document.getElementsByTagName("li")

Wenn der Index 0 ist, nehmen Sie das erste Element

	var li = document.getElementsByTagName("li")[0]

Wenn der Index 1 ist, nehmen Sie den zweiten Punkt

Verwandte Empfehlungen:

Javascript-Lerntutorial

Das obige ist der detaillierte Inhalt vonWas bedeutet Javascript-Selektor?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!