javascript - 为什么不选择和 textarea 值更改在克隆时像输入元素一样更新？

Question

至少在 Firefox 中，当cloneNode(true)在动态或用户更改的 textarea 或 select 元素上使用时，value不会保留属性（DOM 也不会更改以反映动态更改），而对于输入元素，属性的更改value或由用户更改被反映在 DOM 中（因此它在调用 cloneNode 时被保留）。为什么会有这种区别？

更新：

1. 我的意思是问：这种行为是否在某处的规范中规定？（或在错误报告中详细说明？）
2. 示例位于：http: //jsfiddle.net/9RSNt/1/

Answer 1

我怀疑出现差异是因为stextarea的select值是由它们的节点内容决定的。修改控件的值会修改它们的 DOM 属性，但不会修改它们的节点内容，因此当您克隆它们时，克隆具有原始元素的值。

您可以通过在更改事件上更新其节点内容来解决此问题：

// textarea
$("textarea").change(function() { $(this).text($(this).val()); });

// select
$("select").change(function() {
    var sel = $(this).children(":selected");
    $(this.children).not(sel).removeAttr("selected");
    sel.attr("selected", "selected");
});

http://jsfiddle.net/emr2w/8/

编辑：

在这方面有许多 Mozilla 错误案例（有些已解决，有些未解决），但对实际规范的任何提及都很少而且相差甚远。似乎valuea 之后属性的行为cloneNode()可能是规范中没有明确定义的灰色区域。毕竟， 的目的cloneNode()是克隆一个DOM 节点，而不一定是它的对象状态。

https://bugzilla.mozilla.org/show_bug.cgi?id=197294
https://bugzilla.mozilla.org/show_bug.cgi?id=230307
https://bugzilla.mozilla.org/show_bug.cgi?id= 237783