Question

我对JavaScript比较陌生，我需要一个概念的帮助。

所以，我写了一些东西，例如，在HTML文件中，我有一个id为“GetID”的div，这是我想要显示字符串输出的地方。

JavaScript内部是

这样的代码

for(looping through data) {
    if (Condition 1){
        document.getElementById("GetID").innerHTML = "Yellow"
    }
    else if (Condition 2){
        document.getElementById("GetID").innerHTML = "Red"
    }
}

我的问题是，除了上一个条件之外，我如何显示下一个条件，而不是每次在div中替换它？

例如，如果循环运行，第一个和第二个条件是黄色，第三个是红色，我希望它显示“黄色，黄色，红色” 现在，它一直在替换它，黄色，然后是黄色，然后是红色 - 只有1个字符串输出在同一个div ID中，取代了以前的输出

Answer 1

这是因为您每次都重新分配innerHTML，从而覆盖其内容。

尝试使用innerHTML或innerText + =“yellow”而不是仅使用'='。所以：

for(looping through data) {
if (Condition 1){
    document.getElementById("GetID").innerHTML += "Yellow, "
}
else if (Condition 2){
    document.getElementById("GetID").innerHTML += "Red, "
}

}

尽管如此，这确实会让你留下一个悬空的逗号。

Answer 2

我建议使用一个数组来保存你的颜色，如果你想要很好地格式化它：

// Get element
var colorsElement = document.getElementById('GetID');
var colors = [];

// Clear element
colorsElement.innerHTML = '';

// Loop through and build array
for (loop) {
  if (condition1) {
    colors.push('Yellow');
  } else if (condition2) {
    colors.push('Red');
  }
}

// Display colors    
colorsElement.innerHTML = colors.join(', ');

通过这种方式，您可以获得黄色，黄色，红色和＃34;就像你要求的那样。在每次迭代时直接编辑HTML（正如其他答案推荐的那样）很好，但不会出现相同的情况（例如，这将使它成为＆＃34;黄色，黄色，红色，＆＃34;但是当它碰到最后一个时，它就没有办法停止逗号。）使用带有join的数组会按照您的要求格式化字符串。

Answer 3

只需使用+=代替=，请参阅小提琴：http://jsfiddle.net/23n76huL/14/

document.getElementById("GetID").innerHTML += "Yellow";

Answer 4

另一个解决方案是向div添加新元素。

此处的代码基于Ben Blank

的解决方案

var arr = ["Yellow", "Red", "Blue"];

for(var i = 0; i < arr.length; i++) {
    var newSpan = document.createElement('span');
    newSpan.innerHTML = gallery.image[i].url;
    document.getElementById("GetID").appendChild(newSpan);
}

Answer 5

您可以添加innerHTML值

document.getElementById("test").innerHTML += e.value;

我的样本

http://jsfiddle.net/quwkh25y/1/

IF语句中的JavaScript字符串输出

5 个答案: