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

<分区>

我的代码如下。我需要为输入字段动态分配不同的名称。我知道如何为单个变量或字段做这件事，但对于动态创建的元素，这很难，我不知道该怎么做

for(var j=1;j<=i;j++)
{
    var table = document.getElementById("ing");
    var row = table.insertRow(-1);
    //var cell8=row.incertCell(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2);
    var cell4 = row.insertCell(3);
    var cell5 = row.insertCell(4);
    var cell6 = row.insertCell(5);    

    var name='ingname'+j;
    var code='ingcode'+j;
    var cur='ingcur'+j;
    var req='ingreq'+j;
    var cost='ingcost'+j;
    var date='ingdate'+j;

    cell1.innerHTML = "<input type='text' name=name>";
    cell2.innerHTML = "<input type='text' name=code>";
    cell3.innerHTML = "<input type='number' name='ingcur+i'>";
    cell4.innerHTML = "<input type='number' name='ingreq+i'>";
    cell5.innerHTML="<input type='number' name='ingcost+i'>";
    cell6.innerHTML="<input type='date' name='ingdate+i'>";
}

最佳答案

对于您的 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"));

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

获取父元素并选择所有子元素，然后递归遍历它们:

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

或者您可以为它们提供一些可区分的属性和用途:

document.querySelectorAll();

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

这应该有助于您入门。

关于javascript - 如何动态添加 javascript 变量值作为 html 元素的属性？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55262936/

上一篇：javascript - 在同一位置输出具有相同值的对象

下一篇：javascript - ReactJS mobx - 不更新可观察数组

相关文章：

javascript - 如何根据按钮单击验证表单字段？

javascript - Charts.Js 与 Asp.Net Webforms 不起作用

javascript - 在未识别的 native react 中导入 ES 模块

javascript - 无法控制台记录我点击的 div

jquery - 将圆线插入图标圆圈

javascript - 如何设置 Javascript 程序等待

javascript - nodejs settimeout 是否在不同循环中共享变量

javascript - 如何让值(value)体现出来？

java - 用 Java 打印 DOM 树？

javascript - 如何通过选择选项来自动激活特定的选择/列表菜单？