4 に答える
残念ながら、あなたのリンクはどれも機能しません:(
ただし、いくつかの洞察attr
は、すべての属性に関するものです。prop
プロパティ用です。
古いバージョンの jQuery (<1.6) では、attr
. nodeName
、selectedIndex
、またはなどの DOM プロパティにアクセスするには、defaultValue
次のようにする必要があります。
var elem = $("#foo")[0];
if ( elem ) {
index = elem.selectedIndex;
}
それはひどいので、prop
追加されました:
index = $("#foo").prop("selectedIndex");
これは素晴らしいことでしたが、厄介なことに、これは下位互換性がありませんでした。
<input type="checkbox" checked>
には の属性はありchecked
ませんが、 というプロパティがありますchecked
。
そのため、1.6 の最終ビルドでは、問題が発生attr
しないようにすることも行いprop
ます。きれいに切れてほしいという声もありましたが、あちこち壊れなかったので正解だったと思います!
それにかんする:
Prop: JavaScript による変更後の現在の状態の値
Attr: ページ読み込み時に html で定義された値。
属性が実際に何度も変更されるため、これは常に正しいとは限りませんが、checked などのプロパティの場合、変更する属性がないため、prop を使用する必要があります。
参考文献:
.prop と .attr の違いを確認する明確なケースがあります。
以下の HTML を検討してください。
<form name="form" action="#">
<input type="text" name="action" value="myvalue" />
<input type="submit" />
</form>
<pre id="return">
</pre>
jQuery を使用した以下の JS :
$(document).ready(function(){
$("#return").append("$('form').prop('action') : " + $('form').prop('action') + '\r\n');
$("#return").append("$('form').attr('action') : " + $('form').attr('action') + '\r\n');
$("#return").append("document.form.action : " + document.form.action);
});
次の出力を作成します。
$('form').prop('action') : [object HTMLInputElement]
$('form').attr('action') : #
document.form.action : [object HTMLInputElement]
私はこれを試しました
console.log(element.prop(property));
console.log(element.attr(property));
そして、それは以下のように出力されます
http://fiddle.jshell.net/test/
/test/
これは、 が で読み取られaction
た場合にのみ正規化されることを示している可能性があります。prop
jquery 1.6.1+ attr() は 1.6 以前のようにプロパティを返したり変更したりします。したがって、テストはあまり意味がありません。
戻り値の小さな変更に注意してください。
例えば
attr('checked'): 1.6.1 以降、1.6 より前は true/false が返されます。「チェックあり」/「未定義」を返します。
attr('selected'): 1.6.1 以前は true/false が返されましたが、1.6.1 では "selected"/undefined が返されました。
このトピックのドイツ語での詳細な概要は、次の場所にあります。