Heim > Artikel > Web-Frontend > So legen Sie Attribute für Elemente in JQuery fest
So legen Sie Attribute für Elemente in JQuery fest
- 青灯夜游Original
- 2022-03-10 18:42:116977Durchsuche
Einstellungsmethode: 1. Verwenden Sie die Methode attr(), Syntax „$(selector).attr(attribute name, value)“ oder „$(selector).attr({attribute name: value;})“ 2. Verwenden Sie prop()-Methode, Syntax „$(selector).prop(property name, value)“.
Die Betriebsumgebung dieses Tutorials: Windows7-System, jquery1.10.2-Version, Dell G3-Computer.
jquery legt Attribute für Elemente fest
1 Verwenden Sie die Methode attr()
attr(), um den Attributwert des ausgewählten Elements festzulegen oder zurückzugeben. Abhängig von den Parametern der Methode ist auch die Funktionsweise unterschiedlich.
Syntax:
//单个属性
$(selector).attr(属性名,值)
//多个属性
$(selector).attr({属性名:值;属性值:值...})2. Verwenden Sie die prop()-Methode
prop()-Methode, um die Attribute und Werte des ausgewählten Elements festzulegen oder zurückzugeben.
Wenn diese Methode zum Festlegen von Attributwerten verwendet wird, werden ein oder mehrere Attribut-/Wertpaare für den Satz übereinstimmender Elemente festgelegt.
Syntax:
//单个属性
$(selector).prop(属性名,值)
//多个属性
$(selector).prop({属性名:值;属性值:值...})3. Der Unterschied zwischen den Methoden attr() und prop()
Die Methode prop() ähnelt der Methode attr(), beide werden verwendet, um die HTML-Attribute des zu erhalten oder festzulegen Element, aber beides. Es gibt auch grundlegende Unterschiede.
Offizielle jQuery-Empfehlung: Für Attribute mit zwei Werten von wahr und falsch, z. B. aktiviert, ausgewählt, deaktiviert usw., wird empfohlen, die prop () -Methode zum Betrieb zu verwenden, während für andere Attribute die Verwendung empfohlen wird attr()-Methode zum Betrieb.
Beispiel:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(function () {
$('input[type="radio"]').change(function(){
var bool = $(this).attr("checked");
if(bool){
$("p").text("你选择的是：" + $(this).val());
}
})
})
</script>
</head>
<body>
<div>
<label><input type="radio" name="fruit" value="苹果" />苹果</label>
<label><input type="radio" name="fruit" value="香蕉" />香蕉</label>
<label><input type="radio" name="fruit" value="西瓜" />西瓜</label>
</div>
<p></p>
</body>
</html>Der Vorschaueffekt ist in Abbildung 1 dargestellt.
Analyse
$().change(function(){
……
})Das Obige stellt das Änderungsereignis in jQuery dar, das mit dem onchange-Ereignis in JavaScript identisch ist. Wir werden es später im Detail vorstellen.
In diesem Beispiel möchten wir tatsächlich $(this).attr("checked") verwenden, um festzustellen, ob das Optionsfeld ausgewählt ist. Wenn es ausgewählt ist, erhalten Sie den Wert des Optionsfelds. Aber nachdem ich den Code ausgeführt hatte, stellte ich fest: Es hat überhaupt keine Wirkung! Warum ist das so?
Tatsächlich können wir die aktivierten, ausgewählten und deaktivierten Attribute des Formularelements nicht mit der Methode attr() abrufen, sondern müssen die Methode prop() verwenden. Daher funktioniert es, wenn wir die Methode attr() durch die Methode prop() ersetzen.
Tatsächlich scheint die prop()-Methode die Mängel der attr()-Methode bei Formularattributoperationen auszugleichen. Erinnern Sie sich an einen Satz: Wenn eine Eigenschaft mit der Methode attr() nicht abgerufen oder festgelegt werden kann, kann dies durch Ändern der Methode prop() erreicht werden.
【Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Frontend-Video】
Das obige ist der detaillierte Inhalt vonSo legen Sie Attribute für Elemente in JQuery fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!