Question

我在创建功能格式时使用了一些代码。在谈到代码时，我是一个巨大的菜鸟，但我试图对它进行逻辑推理，并通过在线教程向其他人学习。

我一直在研究下面的代码，该代码读取表中的RISK列，并应循环遍历IF语句。

<div id="[@field:Risk]"></div>

<script>
    var line_id = '[@field:Risk]';
    var line=document.getElementById(line_id).parentNode.parentNode;
    var elems = line.getElementsByTagName("td"); 

    for (var i = 0, m = elems.length; i < m; i++) {
        if (elems[i].innerHTML == "Low") { elems[i].style.color="ForestGreen";} 
        if (elems[i].innerHTML == "Low") { elems[i].style.fontWeight = "600";}
        if (elems[i].innerHTML == "Mid") { elems[i].style.color="DarkOrange";}
        if (elems[i].innerHTML == "Mid") { elems[i].style.fontWeight = "600";}
        if (elems[i].innerHTML == "High") { elems[i].style.color = "Red";}
        if (elems[i].innerHTML == "High") { elems[i].style.fontWeight = "600";} 
    }
</script>

然而，在找到Low，Mid和High的第一个实例后，根据上面的格式突出显示这些术语的其他任何外观。在找到三个定义的术语后，循环有效地停止。我很困惑为什么会出现这种情况。任何人都可以帮助/解释我做错了吗？

Answer 1

你能试试吗？

<div id="[@field:Risk]"></div>
<SCRIPT LANGUAGE="JavaScript">
var line_id='[@field:Risk]';
var line=document.getElementById(line_id).parentNode.parentNode;
var elems = line.getElementsByTagName("td");
var colors = {
  Low: "ForestGreen",
  Mid: "DarkOrange",
  High: "Red",
}

for (var i=0, m=elems.length; i<m; i++) {
  if (colors[elems[i].innerHTML]) {
    elems[i].style.fontWeight = 600;
    elems[i].style.color = colors[elems[i].innerHTML]
  } else {
    console.warn("Unknow value of " + elems[i].innerHTML + " for index " + i)
  }
}</SCRIPT>

Answer 2

<div id="[@field:Risk]"></div>
<script type="text/javascript">//use lowercase; LANGUAGE="JavaScript" is deprecated
var line_id='[@field:Risk]';
var line=document.getElementById(line_id).parentNode.parentNode;
var elems = line.getElementsByTagName("td"); 
for (var i=0, m=elems.length; i<m; i++) {
if (elems[i].innerHTML=="Low")  { 
    elems[i].style.color="ForestGreen";
    elems[i].style.fontWeight = "600";} 
//if (elems[i].innerHTML=="Low") { elems[i].style.fontWeight = "600";}
if (elems[i].innerHTML=="Mid")  { 
    elems[i].style.color="DarkOrange";
    elems[i].style.fontWeight = "600";}
//if (elems[i].innerHTML=="Mid")  { elems[i].style.fontWeight = "600";}
if (elems[i].innerHTML=="High")  { 
    elems[i].style.color="Red";
    elems[i].style.fontWeight = "600";}
//if (elems[i].innerHTML=="High")  { elems[i].style.fontWeight = "600";} 
}
</script>

Answer 3

您的代码适用于我，请参阅演示： http://jsbin.com/capatoyidu/edit?html,console,output

但是，您的代码可以简化为以下内容：

<div id="[@field:Risk]"></div>
<SCRIPT LANGUAGE="JavaScript">
var line_id='[@field:Risk]';
var line=document.getElementById(line_id).parentNode.parentNode;
var elems = line.getElementsByTagName("td"); 
for (var i=0, m=elems.length; i<m; i++) 
{
if (elems[i].innerHTML=="Low")  { 
  elems[i].style.color="ForestGreen";
  elems[i].style.fontWeight = "600";
} else if (elems[i].innerHTML=="Mid") { 
  elems[i].style.color="DarkOrange";            
  elems[i].style.fontWeight = "600";
} else if (elems[i].innerHTML=="High")  { 
  elems[i].style.color="Red";
  elems[i].style.fontWeight = "600";
} 
}
</SCRIPT>

条件格式的Javascript在第一次迭代后停止

3 个答案: