javascript - jQuery .val() は html チャンクで動作しませんか?

Question

このコードが期待どおりに機能しない理由がわかりません。

var $obj = jQuery('<div>xx<input type="text" value="" />xx</div>');
$obj.find('input').val('testing');
console.log($obj.html());

結果の出力は変更されません。つまり、値は変更されません。しかしappend()、他の機能は正常に動作します。何が間違っている可能性がありますか？

Answer 1

value入力ダイアログの属性です。

これを行うと、DOM の値ではなく、 valueプロパティ.val(...)が変更されます。

プロパティと属性の違いについては、こちらを参照してください。

---

value 属性の物理的な変化を見たい場合は、次のようにすることができます。

var $obj = jQuery('<div>xx<input type="text" value="" />xx</div>');
$obj.find('input').attr('value','testing');
console.log($obj.html());

デモ: http://jsfiddle.net/maniator/YsZLt/

Answer 2

"value"-attribute はプロパティにマップされます.defaultValue。

プロパティにマップされる属性はありません.value。ただし、汚れていない入力の 入力では、属性"value"(および明らかに.defaultValue) を設定でき、それがプロパティに反映されます.value。

あなたの入力は汚れていないので、これを行うことができます

var $obj = jQuery('<div>xx<input type="text" value="" />xx</div>');
$obj.find('input').prop('defaultValue', 'testing');
console.log($obj.html());
//xx<input type="text" value="testing">xx