document.body.innerHTML只返回最后一个大小写

document.body.innerHTML only returns the last case

本文关键字：最后一个 大小写 返回 body innerHTML document      更新时间：2023-09-26

我的代码有什么问题？我试图让它为所有项目返回true/false（如果年龄等于27岁），但它只打印最后一个案例，这是真的。

我怎样才能把它们一个接一个地打印出来？

var people = [{
    name: "Name1",
    age: 29
}, {
    name: "Name2",
    age: 33
}, {
    name: "Name3"
}, {
    name: "Name4",
    age: 27
}, ];
for (var i = 0; i < people.length; i++) {
    if (people[i].age === 27) {
        document.body.innerHTML = "True for person number " + i + "</br>";
    } else {
        document.body.innerHTML = "False for person number " + i + "</br>";
    }
};

http://jsfiddle.net/rmppdn34/1/

谢谢！

问题不在于只显示最后一个人的详细信息，而在于每个详细信息都被显示，但随后被循环的下一次迭代覆盖，这是因为您不是在每次迭代中添加内容，而是在每次迭代上覆盖。改为使用：

if(people[i].age === 27) {
        document.body.innerHTML += "True for person number " + i + "</br>";
    }
    else {
        document.body.innerHTML += "False for person number " + i + "</br>";
    }
}

JS Fiddle演示。

如果你看看运营商，在你最初的情况下，你有：

document.body.innerHTML = "True for person number " + i + "</br>";

如前所述，它在每次循环运行时覆盖innerHTML*，并评估/执行if；而我改成了：

document.body.innerHTML += "True for person number " + i + "</br>";

+=将新值/输出附加到现有值

您可以用一个简单的三进制来简化if，因为您的输出是一个布尔值，它将由一个简单条件运算符返回：

document.body.innerHTML += (people[i].age === 27) + ' for person number ' + i + '<br />';

JS Fiddle演示。

参考文献：

  • 条件性（"Ternary"）运算符
  • 字符串运算符

您必须使用+=:进行追加

    if(people[i].age === 27) {
        document.body.innerHTML += "True for person number " + i + "</br>";
    }
    else {
        document.body.innerHTML += "False for person number " + i + "</br>";
    }

改为追加覆盖；）

 document.body.innerHTML += "True for person number " + i + "</br>";

这样做。

var people = [
    {
    name : "Name1",
    age : 29},
    {
    name : "Name2",
    age : 33},
    {
    name : "Name3"},
    {
    name : "Name4",
    age : 27},
];
for (var i = 0; i < people.length; i++){
    if(people[i].age == 27) {
        document.body.innerHTML += "True for person number " + i + "</br>";
    }
    else {
        document.body.innerHTML += "False for person number " + i + "</br>";
    }
};

输出：对于编号为0的人员为False1号人物为假第2个人为假适用于3号人员

这是因为每次迭代都要替换整个内容。您应该在将字符串放入文档之前生成所有字符串，因为访问innerHTML是一个非常缓慢的操作。

var people = [{
    name: "Name1",
    age: 29
}, {
    name: "Name2",
    age: 33
}, {
    name: "Name3"
}, {
    name: "Name4",
    age: 27
}, ];
var s = "";
for (var i = 0; i < people.length; i++) {
    if (people[i].age === 27) {
        s += "True for person number " + i + "</br>";
    } else {
        s += "False for person number " + i + "</br>";
    }
};
document.body.innerHTML = s;
相关文章：