Question

我有一个通过JS（createElement("INPUT")）创建输入元素的程序。
我试图在运行时通过更改属性value和text来更改元素的值，但是该属性已更改，并且在输入框中看到的值仍保持先前的值。

如何在运行时更改值？

Answer 1

您可以使用.value来获取和更改新创建的元素的value属性。

工作片段示例：

//create text input
var someInput = document.createElement("INPUT");
someInput.setAttribute("type", "text");

//append element to DOM
var myDiv = document.getElementById("someCode");
myDiv.appendChild(someInput);

//change input value
someInput.value = "New Value"

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Snippet</title>
</head>
<body>
  <div id="someCode">
    
  </div>
  
  
</body>
</html>

Answer 2

如先前所示更改输入值的值应该可以。

属性已更改，我在输入框中看到的值仍保持为先前的值。

然而，发布者正在寻找的真正答案是为什么价值没有按预期变化。

属性显示初始值

DevTools中的值未更改的原因是，value属性将仅显示输入的初始值，而不显示输入的任何更改。

值输入控件的值。在HTML中指定时，这是初始值，此后可以使用JavaScript访问相应的HTMLInputElement对象的value属性随时对其进行更改或检索。 value属性始终是可选的。

请参见MDN。

如何通过属性更改<input type =“ text”>值

2 个答案:

属性显示初始值