序列化输入。没有得到它的（更新的）价值

Question

简单的问题（我认为）：

如果更改输入中的值，XMLSerializer 的字符串结果不会显示该值

在我的代码片段中，尝试在输入中输入 a，然后单击序列化。

为什么它没有改变，我该怎么做才能获得更新的 HTML INPUT？

document.getElementById('clk').addEventListener("click", function() {
  console.log(new XMLSerializer().serializeToString(document.getElementById('foo')));
});

<input id='foo' />
<button id='clk'>Serialize</button>

Answer 1

您可以使用输入事件（或更改事件）侦听器来更新值属性

document.getElementById('clk').addEventListener("click", function() {
  console.log(new XMLSerializer().serializeToString(document.getElementById('foo')));
});


document.querySelector('input#foo').addEventListener("input", function(){
   this.setAttribute('value', this.value);
})

<input id='foo' />
<button id='clk'>Serialize</button>

序列化输入。没有得到它的（更新的）价值

Serializing an INPUT. Not getting its (updated) value

html

javascript

xml-serialization