javascript - Javascript innerHTML 更新错误

Question

我有以下 javascript 行：

<div id="box" name="1" margin="4px" padding="4px" onclick="memory(1)"></div>

相关的memory()功能是：

function memory(a) {
    var tmpDar = a-1;
    var m = document.getElementsByName(tmpDar);
    m.innerHTML = arrA[tmpDar];

}

但是，当我尝试执行代码时，HTML 并没有改变……有人可以帮我吗？

Answer 1

document.getElementsByName()返回一个 NodeList 而不是单个元素！

因此，为了设置innerHTML您的 div，您必须在该数组中引用一个条目，例如，像这样：

function memory(a) {
    var tmpDar = a-1;
    var m = document.getElementsByName(tmpDar);
    m[0].innerHTML = arrA[tmpDar];
}

在您的代码中，您设置innerHTMLNodeList 对象的属性，该对象在文档中没有（视觉）效果。

一般来说，最好使用id而不是name. 然后你可以document.getElementById()像这样使用：

function memory(a) {
    var tmpDar = a-1;
    var m = document.getElementById(tmpDar);
    m.innerHTML = arrA[tmpDar];
}

Answer 2

0据我所知，您试图找到名称为的所有元素。而且没有0名字。

还有其他两个所说的，它返回一个数组，您需要调用该数组的索引。

Answer 3

document.getElementsByName返回一个数组。因此，如果您想要的元素具有此名称是唯一的，则应将代码替换为：

function memory(a) {
    var tmpDar = a-1;
    var m = document.getElementsByName(tmpDar);
    m[0].innerHTML = arrA[tmpDar];  // Here I have added index 0
}