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是输入对话框的属性。

这样做.val(...)会更改 value属性，而不是 DOM 中的值。

有关属性和属性之间的差异，请参见此处。

---

如果您想查看 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"映射到.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