Was ist der Unterschied zwischen jquery css() und attr()

Unterschied: attr() arbeitet hauptsächlich mit den Attributen von Elementen (im Zusammenhang mit HTML-Tags), wie dem src-Attribut und dem alt-Attribut von img, dem href-Attribut eines Links usw., während css() die Attribute in ändert der Stil (bezogen auf Stil), der das Attribut im Stil ist.

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

Es gibt zwei Methoden, attr() und css() in jquery:

attr ist die Abkürzung für attribute, was Label-Attribut bedeutet. CSS ist Stil, was den Stil des Elements bedeutet.

jquery attr()-Methode

attr()-Methode legt die Attribute und Werte des ausgewählten Elements fest oder gibt sie zurück.

Wenn diese Methode zur Rückgabe eines Attributwerts verwendet wird, wird der Wert des ersten übereinstimmenden Elements zurückgegeben.

Wenn diese Methode zum Festlegen von Attributwerten verwendet wird, werden ein oder mehrere Attribut/Wert-Paare für das passende Element festgelegt.

Syntax

Gibt den Wert des Attributs zurück:

$(selector).attr(attribute)

Legen Sie das Attribut und den Wert fest:

$(selector).attr(attribute,value)

Attribut: Gibt den Namen des Attributs an.

Wert: Gibt den Wert des Attributs an.

jquery css()-Methode

css()-Methode gibt ein oder mehrere Stilattribute des übereinstimmenden Elements zurück oder legt dieses fest.

Gibt den CSS-Eigenschaftswert des ersten passenden Elements zurück.

Hinweis: Kurzschrift-CSS-Eigenschaften (wie „Hintergrund“ und „Rahmen“) werden nicht unterstützt, wenn sie zur Rückgabe eines Werts verwendet werden.

$(selector).css(name)

Name: erforderlich. Gibt den Namen der CSS-Eigenschaft an. Dieser Parameter kann eine beliebige CSS-Eigenschaft enthalten. Zum Beispiel „Farbe“.

Der Unterschied zwischen attr() und css() in jquery

attr() in jquery besteht darin, die Attribute und Werte von Elementen abzurufen/zu ändern (im Zusammenhang mit HTML-Tags); Abrufen/Ändern des Stils von Elementattributen (in Bezug auf den Stil).

attr() arbeitet hauptsächlich mit den Attributen von Elementen, wie dem src-Attribut und dem alt-Attribut von img, dem href-Attribut eines Links usw.;

css() ändert die Attribute im Stil, d. h Attribute im Stil.

Ersteres kann das src-Attribut von a1f02c36ba31691bcfe87b2722de723b, das href-Attribut von 3499910bf9dac5ae3c52d5ede7383485 und das title-Attribut von d5fd7aea971a85678ba271703566ebfd ändern. Letzteres funktioniert jedoch nicht. Es können nur stilbezogene Funktionen geändert werden.

Letzteres ist also eine Teilmenge des ersteren und wirkt sich nur auf das spezifische Attribut Stil aus.

Beispiel:

HTML

<div style="color:red;font-weight:bold;" id="a" data-id="1" class="mystyle">Hello</div>

Javascript

<script type="text/javascript">
$(function() {
//css()
var color = $("#a").css("color"); //只有一个参数时，是获取div#a的color，返回red
$("#a").css("color", "blue"); //两个参数时,是设置对应的 样式属性，这里是这只文本color为blue
// $("#a").css({"color":"blue","fontWeight":"normal"});//也支持对象形式进行设置样式
//attr()
//获取div#a上面的data-id属性的值；当然，style,class,id这三个都可以获取到，因为这些都是Html元素的 属性
var id = $("#a").attr("data-id");
//$("#a").attr("data-id",2);//设置div#a上面的data-id属性为2，
                //假如是一个不存在的属性，使用这个代码，就会添加这个属性到匹配到的元素上面 
               //如$("#a").attr("data-width","100px");,使用这个，div#aHtml元素上面就会新增一个data-width的属性
});
</script>

Zusammenfassung

css() Methode dient zum Abrufen/Ändern von Stilattributen (in Bezug auf den Stil);

attr() ist zu bekommen / Methode zum Ändern der Attribute von Elementen (im Zusammenhang mit HTML-Tags);

attr()- und css()-Operationen für Stile gelten beide für Inline-Stile.

style ist auch ein Attribut des Elements, und attr() kann auch damit arbeiten, sodass CSS() funktional als Teilmenge von attr() betrachtet werden kann. Die Operation

attr() gibt einen String zurück und die Operation css() gibt ein Objekt zurück.

Empfohlene verwandte Video-Tutorials:

jQuery-Tutorial(Video)

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen jquery css() und attr(). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!