Heim > Web-Frontend > js-Tutorial > Analyse der Verwendung von CSS-Selektoren in Jquery_jquery

Analyse der Verwendung von CSS-Selektoren in Jquery_jquery

WBOY
Freigeben: 2016-05-16 16:14:54
Original
2043 Leute haben es durchsucht

Die Beispiele in diesem Artikel beschreiben die Verwendung von CSS-Selektoren in Jquery. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

jQuery verwendet eine Reihe von CSS-Selektoren. Insgesamt gibt es 5 Typen, nämlich Tag-Selektor, ID-Selektor, Klassen-Selektor, Universal-Selektor und Gruppen-Selektor, die wie folgt beschrieben werden:

1. Tag-Selektor

wird verwendet, um vorhandene Tag-Elemente auf der HTML-Seite auszuwählen, auch als Elementselektor bekannt, Format: $("element"), z. B. $("div"), dasselbe wie getElementByTagName

2. ID-Auswahl

wird verwendet, um ein Element mit einem ID-Attribut abzurufen. Das Format ist wie folgt: $("id"), dasselbe wie getElementById

Code kopieren Der Code lautet wie folgt:

$("#users").val();

3. Klassenauswahl

wird verwendet, um ein Element mit einem Klassenattribut abzurufen, Format: $("class")

Code kopieren Der Code lautet wie folgt:

Fügen Sie diesem Textfeld zunächst einen Rahmenstil hinzu. Verwenden Sie zunächst das Klassenattribut, um das Textfeld zu binden

Code kopieren Der Code lautet wie folgt:
$(".t").css("border", " 2px durchgehend blau ");

4. Universeller Selektor

Der universelle Selektor (*) gleicht alle Elemente ab und wird hauptsächlich für die kontextbezogene Suche verwendet, d. h. um alle Tags in der HTML-Seite zu finden, $("*")

5. Gruppenauswahl

wird auch als Multi-Element-Selektor bezeichnet, der zur Auswahl der Ergebnisse aller angegebenen Selektorkombinationen verwendet wird. Die Syntax lautet wie folgt:


Code kopieren Der Code lautet wie folgt:
$("selector1, seletor2, selector3")
Zum Beispiel:

Code kopieren Der Code lautet wie folgt:
$("div, span, p. styleClass"). css("border", "1px solid red");

Umfassendes Beispiel:

Code kopieren Der Code lautet wie folgt:
 
 
 
 
css-Datei 
 
 
 
 
 
 

这是标题中的文本

 
 

 
 
div元素:id属性为div1.
 
 
div元素:id属性为div2.
 
 
div元素:id属性为div3.
 
 

效果图如下所示:

Sie haben die jQuery-Version mit jQuery erstellt.

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage