我创建了一个用于拆分值的函数并在 for 循环中运行，但 for 循环在单个循环后终止。
如果我有一个包含 4 个项目的数组，那么它只运行一次：
function color_change() {
//alert(document.getElementById("dom-target"));
var div_fgh = document.getElementById("dom-target");
var myData = div_fgh.textContent;
//alert(myData);
alert(myData);
var stall_wished= myData;
var array_WW= stall_wished.split(",");
alert(array_WW.length);
for (j=0;j<array_WW.length;j++){
var wished_stalls = array_WW[j];
alert(wished_stalls);
document.getElementById(wished_stalls).style.background="#F90";
}
}
- http://jsfiddle.net/40y8a3p3/
查看控制台，您在其中收到错误。
Uncaught TypeError: Cannot read property 'style' of null
这是因为没有定义 id 的元素1、2、3、4、5
因此，第一次进入循环会给您一个警报，然后出现错误并中断。
定义所有 ID，它将起作用
这里是：http://jsfiddle.net/40y8a3p3/1/
- 根据
dsfq在另一个答案中指出的内容，我有另一种解决它的选项，如果文本中有一个空格（导致字符串数组不完全匹配元素 id 的字符），您可以看到这个 http://jsfiddle.net/40y8a3p3/3/
编辑：根据OP下面的评论，我对 法典。。http://jsfiddle.net/vkgg9rg1/10/我只需要修剪白色 空格之前通过ID查找元素，因为它可能包含白色 空间。
问题似乎出在字符串拆分操作的不整洁结果中。很可能,字符周围有空格，导致字符串数组与元素 id 不完全匹配。因此，结果document.getElementById(wished_stalls)返回null并在第一轮后循环失败。
在拆分方法中使用正则表达式：
var array_WW = stall_wished.split(/'s*,'s*/);
这是演示，您可以在其中看到差异 http://jsfiddle.net/ngy28ky2/
function color_change()
{
//alert(document.getElementById("dom-target"));
var div_fgh = document.getElementById("dom-target");
var myData = div_fgh.textContent;
// var myData = div_fgh.value;// use value if is input type.
console.log(myData);
var stall_wished= myData;
var array_WW= stall_wished.split(",");
for (var j=0;j<array_WW.length;j++){
var wished_stalls = array_WW[j];
document.getElementById(wished_stalls).style.background="#F90";
}
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="dom-target">1,2,3,4,5</div>
<div id="1" style="width:10px;height:10px;border: 2px solid;"></div>
<div id="2" style="width:10px;height:10px;border: 2px solid;"></div>
<div id="3" style="width:10px;height:10px;border: 2px solid;"></div>
<input type="button" onclick="color_change()" value="Click"/>看看你是否正在尝试这样的事情：