如何动态添加javascript变量值作为html元素的属性？

Question

我的代码如下。我需要为输入字段动态分配不同的名称。我知道如何对单个变量或字段执行此操作，但是对于动态创建的元素来说很难，我不知道如何执行< / p>

ABC

Answer 1

对于您的JavaScript，您将要更新输入元素的“名称”值。这是您的操作方式：

function updateName(id) {    
    var newName = 'code'+2;
    document.getElementById(id).setAttribute("name",newName.toString());
}​

您的输入元素将需要一个ID：

<input type="text" name="tempName" id="inputID" />

然后在您的HTML中，调用该函数并传递元素的ID。所以也许：

document.onload(updateName("inputID"));

要动态地执行此操作，有两种快速方法：

1. 获取父元素并选择所有子元素，然后遍历它们：

var childElements = document.getElementById('parentID').children;
for (var i = 0; i < childElements.length; i++) {
    do something here...
}

1. 或者您可以给他们全部一些可区别的属性并使用：

document.querySelectorAll();

https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll

这对帮助您入门很有帮助。

Answer 2

HTML

<input id="first" type="text">
<input id="second" type="text">

JavaScript

document.getElementById('first').setAttribute('name', someVariable)
document.getElementById('second').setAttribute('name', anotherVariable)

Answer 3

使用JS var input = document.getElementById('someId') input.setAttribute('name', i)