Question

我有一个foreach循环，可以查看API查询的所有可能结果

json.results.forEach(function(result) {
     console.log(result.original_title);
     document.getElementById("possibleResults").innerText = result.original_title;
}, this);

console.log 正确输出所有元素，但是正如预期的那样，当我写入可能的结果 div时，它只显示最后的结果。

如何按顺序将结果写入div，这样它们就不会被覆盖，最好没有CSS？

Answer 1

将document.getElementById("possibleResults").innerText = result.original_title;更改为document.getElementById("possibleResults").innerText += result.original_title;第一个选项会替换div的当前内容，这就是您只看到最后结果的原因。第二个将它追加到最后，保留每一个结果。

Answer 2

将所有内容写入变量后添加。

var content;
json.results.forEach(function(result) {
       console.log(result.original_title);
       content += result.original_title;
}, this);

        document.getElementById("possibleResults").innerText = content;

Answer 3

这是因为

document.getElementById("possibleResults").innerText = result.original_title;

每次下一次迭代都会覆盖前一次迭代插入的文本。

尝试

json.results.forEach(function(result) {
     console.log(result.original_title);
     document.getElementById("possibleResults").innerText += result.original_title

}, this);

以div显示所有结果

3 个答案: