Heim > Web-Frontend > js-Tutorial > Hauptteil

So verwenden Sie die Namensauswahl für die innere jQuery-Klasse

php中世界最好的语言
Freigeben: 2018-05-30 09:30:52
Original
1207 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie den internen Klassennamenselektor von jQuery verwenden und welche Vorsichtsmaßnahmen bei der Verwendung des internen Klassennamenselektors von jQuery gelten. Das Folgende ist ein praktischer Fall, schauen wir uns das an .

1. Einführung

Der Klassennamenselektor findet passende DOM-Elemente anhand des Namens der CSS-Klasse, die dem Element gehört.

Auf einer Seite kann ein Element mehrere CSS-Klassen haben, und eine CSS-Klasse kann mit mehreren Elementen übereinstimmen. Wenn ein Element einen passenden Klassennamen enthält, kann dieser über den Klassennamenselektor ausgewählt werden.

Die Auswahl des Klassennamens ist für die meisten Menschen leicht zu verstehen. Der CSS-Klassenname kann als Kursname verstanden werden, und die Studenten können ihn verstehen Wählen Sie mehrere Kurse aus, und ein Kurs kann von mehreren Studenten gewählt werden.

Die Beziehung zwischen CSS-Klassen und Elementen kann eine Viele-zu-Viele-Beziehung, eine Eins-zu-Viele-Beziehung oder eine Viele-zu-Eins-Beziehung sein. Einfach ausgedrückt findet der Klassennamenselektor passende Elemente basierend auf dem CSS-Klassennamen des Elements.

Der Klassennamenselektor wird wie folgt verwendet:

$(".class");
Nach dem Login kopieren

wobei Klasse der CSS-Klassenname ist, der zum Abfragen des Elements verwendet wird.

Um beispielsweise Elemente mit dem CSS-Klassennamen word_orange abzufragen, können Sie den folgenden jQuery-Code verwenden:

$("word_orange");
Nach dem Login kopieren

2. Anwendung

Fügen Sie auf der Seite zunächst zwei

-Tags hinzu und legen Sie die CSS-Klasse für eines davon fest. Wählen Sie dann das

-Tag mit der CSS-Klasse aus, die über die Klassennamenauswahl von jQuery festgelegt wurde seine CSS-Stile.

3. Code

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<p class="myClass">注意观察我的样式</p>
<p>我的样式是默认的</p>
<script type="text/javascript">
$(document).ready(
function()
{
  var myClass = $(".myClass");   //选取DOM元素
  myClass.css("background-color","#C50210");  //为选取的DOM元素设置背景颜色
  myClass.css("color","#FFF");  //为选取的DOM元素设置文字颜色
});
</script>
Nach dem Login kopieren

4. Laufeffekt

Bedienungsanweisungen

Im obigen Code ist CSS nur für eine der

-Tags festgelegt name, aber da es im Programm keine CSS-Klasse namens myClass gibt, hat diese Klasse keine Attribute. Der Klassennamenselektor

gibt einen jQuery-Verpackungssatz mit dem Namen myClass zurück. Mit der Methode css() kann der CSS-Attributwert für das entsprechende p-Element festgelegt werden dunkelrot und die Textfarbe ist auf Weiß eingestellt. Der Klassennamenselektor

kann auch einen Satz von jQuery-Wrappern erhalten, da mehrere Elemente denselben CSS-Stil haben können.

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Detaillierte Erläuterung der Verwendung gängiger integrierter Funktionen in JS

Wie man js verwendet um Ajax-Funktionsfunktionen und -verwendung zu kapseln

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die Namensauswahl für die innere jQuery-Klasse. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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