So fügen Sie Klassennamen zu Elementen in JQuery hinzu

So fügen Sie einem Element in jquery einen Klassennamen hinzu: 1. Verwenden Sie die Anweisung „$(element)“, um das Elementobjekt abzugleichen. 2. Verwenden Sie die Methode addClass(), um dem Element einen Klassennamen hinzuzufügen. Element object.addClass(" Klassenname")".

Die Betriebsumgebung dieses Tutorials: Windows 7-System, JQuery-Version 1.10.0, Dell G3-Computer.

So fügen Sie einem Element mit jquery einen Klassennamen hinzu

1. Erstellen Sie eine neue HTML-Seite, fügen Sie dann eine Schaltfläche mit dem Text

und ein Klickereignis hinzu und fügen Sie dann einen Klick hinzu Ereignis auf die Schaltfläche.

HTML-Code:

<div id="add">点击按钮添加class</div>
<input type="button" value="添加class" onclick="addBtn()" />

Klassenstil hinzufügen. Erstellen Sie ein

CSS-Code:

<style>
.fs40{
font-size: 40px;
}
</style>

2. Einführung der JQuery-Bibliothek. Führen Sie nach dem

js-Code:

<script type="text/javascript">
function addBtn(){
$("#add").addClass("fs40")
}
</script>

Speichern Sie die HTML-Codeseite, öffnen Sie sie dann mit einem Browser und klicken Sie auf das Schaltflächensymbol. Sie werden sehen, dass die Schriftart des

-Tags größer wird, was darauf hinweist, dass die Klassenklasse erfolgreich hinzugefügt wurde .

Alle Codes auf der Seite. Sie können den gesamten Code direkt kopieren, in eine neue HTML-Seite einfügen, den Einführungspfad der JQuery-Bibliothek ändern, den HTML-Code speichern und mit einem Browser öffnen und auf die Schaltfläche klicken, um den Effekt zu sehen.

Alle Codes:

<style>
.fs40{
font-size: 40px;
}
</style>

<script type="text/javascript">
function addBtn(){
$("#add").addClass("fs40")
}
</script>


<div id="add">点击按钮添加class</div>
<input type="button" value="添加class" onclick="addBtn()" />

Ausgabeergebnisse:

Verwandte Video-Tutorial-Empfehlungen: jQuery-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo fügen Sie Klassennamen zu Elementen in JQuery hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!