Question

我正在通过javascript创建一个html表，但我无法将类名设置为这些元素。

我想要的是：点击第二列中的一个输入激活功能。例如，此函数将<p>颜色设置为红色。

我尝试了很多解决方案，但它仍然无效。

HTML：

<div id="table"></div> 
<p id="a">adasd</p>

JS：

var arr = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L"];

var table = "<table><tr><td><b>Test</b></td>";
table += "<td style='width: 50px'>RN</td>";
table += "<td style='width: 50px'>MW</td></tr>";

for (var i=0; i<arr.length; i++) {
    table += "<td>" + arr[i] + "</td>";
    table += "<td><input class='rn' style='width: 50px'></input></td>";
    table += "<td><input style='width: 50px'></input></td></tr>";
}

table += "</table>";

document.querySelectorAll('.rn').onclick = function() {change()};

function change() {
    document.getElementById("a").style.color = "red";
}
document.getElementById("table").innerHTML = table;

Answer 1

您无法使用onclick运行querySelectorAll，这是我的简单解决方案。我刚刚添加onclick='change()'

var arr = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L"];

var table = "<table><tr><td><b>Test</b></td>";
table += "<td style='width: 50px'>RN</td>";
table += "<td style='width: 50px'>MW</td></tr>";

for (var i=0; i<arr.length; i++) {
    table += "<td>" + arr[i] + "</td>";
    table += "<td><input class='rn' style='width: 50px' onclick='change()' ></input></td>";
    table += "<td><input style='width: 50px'></input></td></tr>";
}

table += "</table>";


function change() {

    document.getElementById("a").style.color = "red";
}
document.getElementById("table").innerHTML = table;

<div id="table"></div> 
<p id="a">adasd</p>

在javascript创建的html元素中设置元素类

1 个答案: