Ausführliche Diskussion über die Manipulation der DOM-Elementattribute attr() und removeAtrr() durch jQuery mit den Methoden_jquery

So bearbeiten Sie Elementattribute in jQuery:
attr(): Lesen oder schreiben Sie den Attributwert des passenden Elements.
​removeAttr(): Entfernt das angegebene Attribut aus dem übereinstimmenden Element.

Lesevorgang der Methode attr()

　attr()-Lesevorgang. Was gelesen wird, ist der angegebene Attributwert des ersten Elements im passenden Element.
Format: .attr(attributeName), Rückgabewerttyp: String. Beim Lesen eines nicht vorhandenen Attributs wird undefiniert zurückgegeben.

Beachten Sie, dass das Auswahlergebnis des Selektors eine Menge sein kann und hier nur der Attributwert des ersten Elements in der Menge erhalten wird ​Sehen Sie sich das Beispiel an:

Code kopieren Der Code lautet wie folgt:

Absatz 1

Absatz 2

Titel abrufen

Laufende Ergebnisse: Pop-up-Box zeigt: Titel1.

Wenn Sie die Attribute jedes Elements separat erhalten möchten, müssen Sie die Schleifenstruktur von jQuery verwenden, beispielsweise die Methode .each() oder .map().
Das obige Beispiel kann geändert werden in:

Code kopieren Der Code lautet wie folgt:

Sie können die Attribute jedes Elements separat abrufen

Schreibvorgang der attr()-Methode

　attr()-Schreibvorgang. Weisen Sie einem oder mehreren Attributen des passenden Elements einen Wert zu.

Allgemeines Format: .attr(attributeName, value), das den Wert für das Attribut festlegt.
Rückgabewerttyp: jQuery. Es unterstützt auch Kettenmethodenaufrufe
Wenn beim Ausführen eines Schreibvorgangs der angegebene Attributname nicht vorhanden ist, wird ein Attribut mit diesem Namen hinzugefügt, d. h., sein Name ist Attributname und sein Wert ist Wert

Das Schreiben von Attributen wird so durchgeführt, dass sie zu jedem Element in der Sammlung passen, siehe Beispiel:

Code kopieren Der Code lautet wie folgt:

Dies ist ein Absatz.

Dies ist ein div.

Dies ist ein weiterer Absatz.

Dies ist ein weiteres Div.

Nach dem Klicken auf die Schaltfläche werden alle P's mit dem Attribut title="Hello World" hinzugefügt.

Es gibt zwei weitere Formate für Schreibvorgänge:
　.attr(attributes) und .attr(attributeName, function).
​Das Folgende wird separat vorgestellt.

.attr(attributes):

Der Attributtyp ist hier PlainObject, mit dem mehrere Attribute gleichzeitig festgelegt werden können
Was ist PlainObject? Ein einfaches Verständnis ist eine Folge von Schlüssel-Wert-Paaren, die in geschweifte Klammern eingeschlossen sind. Anweisungen finden Sie am Ende der Frage Schlüssel und Werte werden durch Doppelpunkte (:) und jedes Schlüssel-Wert-Paar durch Kommas (
) getrennt
Hinweis: Beim Festlegen mehrerer Attributwerte sind die Anführungszeichen des Attributnamens optional (können vorhanden sein oder nicht). Das Klassenattribut ist jedoch eine Ausnahme und muss in Anführungszeichen
eingeschlossen werden
Beispiel:

Code kopieren Der Code lautet wie folgt:

Dies ist ein Absatz.

Dies ist ein div.

Dies ist ein weiterer Absatz.

Dies ist ein weiteres Div.

Nach dem Klicken auf die beiden Schaltflächen ändert sich das Element zu:

Darunter ist „Hallo“ in

ein neues benutzerdefiniertes Attribut, dessen Wert World ist.

.attr(attributeName, function(index, oldValue)):
Verwenden Sie eine Funktion, um den Attributwert festzulegen. Der erste Parameter der Funktion ist der Index und der zweite Parameter ist der vorherige Wert des Attributs ​Sehen Sie sich das Beispiel an:

Code kopieren Der Code lautet wie folgt:

div {
Farbe: blau;
}
span {
Farbe: rot;
}
b {
Schriftstärke: fetter;
}

Null-tes

First

Sekunde

　　上面的例子,对应的页面结果如下:

 
　　当使用一个方法来设定属性值的时候, 如果这个set的function没有返回值, 或者返回了undefiniert, 当前的值是不会被改变的.
　　即操作会被忽略.
　　Die Funktion „attr()“ ist undefiniert:
　　如下:

复制代码 代码如下:

 
　　返回的页面效果如下:

　　即没有进行任何修改操作,还是保持原来的属性值.
 
　　注意:jQuery不能修改 und的type属性,如果修改会在浏览器报错.
　　这是因为IE浏览器不能修改type属性.

removeAttr()方法

　　移除匹配元素集合中每一个元素的指定属性.
　　Die Funktion „removeAttribute()“, „removeAttribute()“ und „removeAttribute()“ von jQuery sowie die Verwendung von „removeAttribute()“ und die Verwendung von „removeAttribute()“ sind ebenfalls verfügbar览器上的属性名称可能不统一的问题.
　　例子:

复制代码 代码如下:

   
   

Null

Nach dem Klicken auf die Schaltfläche wird das Titelattribut von
gelöscht
Hinweis: Die Verwendung von „removeAttr()“ zum Entfernen von onclick funktioniert unter IE6-8 nicht. Um dieses Problem zu vermeiden, sollte die Methode „.prop()“ verwendet werden Zum Beispiel:

Code kopieren Der Code lautet wie folgt:

$element.prop( "onclick", null );
console.log( "onclick property: ", $element[ 0 ].onclick );

Stellungnahme：

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