Was ist der Unterschied zwischen attr() und prop() in jquery?

Der Unterschied zwischen attr () und prop () in jquery ist: Die Funktion attr bearbeitet die Attribute des Dokumentknotens, und die festgelegten Attributwerte können nur Zeichenfolgentypen sein js-Objekt und die eingestellten Attributwerte können von jedem Typ sein, einschließlich Arrays und Objekten.

Umgebung:

Dieser Artikel gilt für alle Computermarken.

Einführung in die Unterschiede:

In jQuery werden sowohl die Funktion attr() als auch die Funktion prop() verwendet, um bestimmte Attribute festzulegen oder abzurufen, und ihre Parameter und Verwendung sind nahezu identisch. Es muss jedoch gesagt werden, dass die Verwendung dieser beiden Funktionen nicht gleich ist.

(Empfohlenes Tutorial: jquery-Video-Tutorial)

Die spezifischen Unterschiede sind wie folgt:

1. Verschiedene Operationsobjekte

Offensichtlich sind attr und prop die Abkürzungen der Wörter attribute und property, und sie repräsentieren beide „Attribute“ bedeuten.

Allerdings sind Attribut und Eigenschaft in jQuery zwei verschiedene Konzepte. Das Attribut stellt das Attribut des HTML-Dokumentknotens dar und die Eigenschaft stellt das Attribut des JS-Objekts dar.

<!-- 这里的id、class、data_id均是该元素文档节点的attribute -->
<div id="message" class="test" data_id="123"></div>

<script type="text/javascript">
// 这里的name、age是Person的property
var Person = { name: "小明", age: 18};
</script>

In jQuery besteht das Entwurfsziel der Funktion prop() darin, die Eigenschaft (Eigenschaft) für das angegebene DOM-Element festzulegen oder abzurufen (bezogen auf das JS-Objekt, Elementtyp); das Entwurfsziel der Funktion attr() besteht darin, das Attribut auf dem Dokumentknoten festzulegen oder abzurufen, der dem angegebenen DOM-Element entspricht.

2. Verschiedene Anwendungsversionen

attr() ist eine Funktion, die in jQuery Version 1.0 vorhanden ist, und prop() ist eine neue Funktion in jQuery Version 1.6. Es besteht kein Zweifel, dass Sie vor 1.6 nur die Funktion attr () verwenden können. In 1.6 und späteren Versionen können Sie die entsprechende Funktion entsprechend den tatsächlichen Anforderungen auswählen.

3. Die zum Festlegen verwendeten Attributwerte sind unterschiedlich.

Da die Funktion attr() auf die Attribute des Dokumentknotens wirkt, kann der Attributwertsatz nur vom Typ String sein, wenn er kein String ist Typ, seine toString-Methode wird auch aufgerufen (), um ihn in den String-Typ zu konvertieren. Die Funktion

prop() bearbeitet die Eigenschaften von JS-Objekten, sodass die festgelegten Eigenschaftswerte von jedem Typ sein können, einschließlich Arrays und Objekten.

4. Weitere Details

Vor jQuery 1.6 war nur die Funktion attr() verfügbar, die nicht nur für das Setzen und Abrufen von Attributen zuständig war. Beispiel: Vor jQuery 1.6 konnte attr() auch die Eigenschaften von DOM-Elementen wie tagName, className, nodeName, nodeType usw. festlegen oder abrufen.

Bis jQuery 1.6 die Funktion prop() hinzufügte und zum Festlegen oder Abrufen von Eigenschaften verwendet wurde, wurde attr() nur zum Festlegen und Abrufen von Attributen verwendet.

Darüber hinaus hat attr() für die aktivierten, ausgewählten, deaktivierten und anderen Attribute des Formularelements vor jQuery 1.6 den Rückgabewert dieser Attribute als booleschen Typ erhalten: Wenn es ausgewählt (oder deaktiviert) ist, gibt es true zurück , andernfalls wird false zurückgegeben.

Aber ab 1.6 verwenden Sie attr(), um den Rückgabewert dieser Attribute als String-Typ abzurufen. Wenn es ausgewählt (oder deaktiviert) ist, wird es aktiviert, ausgewählt oder deaktiviert zurückgegeben, andernfalls (das heißt, der Elementknoten tut dies). dieses Attribut nicht haben) gibt undefiniert zurück. Darüber hinaus stellen diese Attributwerte in einigen Versionen den Anfangsstatuswert beim Laden des Dokuments dar. Auch wenn der ausgewählte (oder deaktivierte) Status dieser Elemente später geändert wird, ändern sich die entsprechenden Attributwerte nicht.

Weil jQuery davon ausgeht, dass: „Geprüft“, „Ausgewählt“ und „Deaktiviert“ des Attributs den Wert des Anfangszustands des Attributs darstellen und dass die Eigenschaften „Geprüft“, „Ausgewählt“ und „Deaktiviert“ den Wert des Echtzeitstatus der Eigenschaft darstellen (der Wert ist wahr oder falsch).

Verwenden Sie daher in jQuery 1.6 und späteren Versionen bitte die Funktion prop(), um überprüfte, ausgewählte, deaktivierte und andere Attribute festzulegen oder abzurufen. Versuchen Sie für andere Operationen, die mit prop() implementiert werden können, die Funktion prop() zu verwenden.

<button>按钮</button>
    <input type="checkbox" name="" id="" checked="checked">
    <script src="jquery.js"></script>
    <script>
        // $(&#39;button&#39;).on(&#39;click&#39;,function(){

        // });
        // var r = $(&#39;input&#39;);
        $(&#39;button&#39;).on(&#39;click&#39;,function(){
            console.log(11)
            if ($(&#39;input&#39;).prop(&#39;checked&#39;)) {
                $(&#39;input&#39;).prop(&#39;checked&#39;,false);
            }else{
                $(&#39;input&#39;).prop(&#39;checked&#39;,true);
            }
        })
    </script>
   // attr / prop
// attr ==> getAttribute() / setAttribute()
// 用于操作 自定义的属性，对于DOM对象自身的布尔值类型的属性，只能
// 通过这个两个方法来设置或者读取默认值，而不能动态改变值
// 
// prop ==> dom.checked = true;
// 对于 布尔值的属性（selected/checked/diabled） 都需要通过直接访问属性
// 方式来操作（点语法、[]）

Jeder weiß, dass natives JS das innere HTML und das äußere HTML passender Elemente erhalten kann. Das innere ist innerHTML und das äußere ist äußeres HTML. Das Dom-Objekt von nativem JS hat diese beiden Attribute:document.getElementById("linkType" ) .outerHTML;

Wie erhält man die passenden Elemente (einschließlich des HTML seiner eigenen Elemente) mit jQuery?

Da dieses Attribut vorhanden ist, können wir es mit $("#linkType").prop("outerHTML") abrufen.

Es kann mit $("#linkType").prop("outerHTML",outerHTML) zugewiesen werden ) Ändern Sie den Inhalt von OuterHTML.

Es ist zu beachten, dass attr von jQuery diesen Attributwert nicht erhalten kann.

Verwandte Empfehlungen:

JS-Tutorial

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