以编程方式构造用于if()语句的条件

Wil*_*llD 33 javascript

让我们假设我有这样的事情:

if (document.getElementById('div1').innerHTML &&
    document.getElementById('div2').innerHTML &&
    document.getElementById('div3').innerHTML &&
    document.getElementById('div4').innerHTML &&
    document.getElementById('div5').innerHTML &&
    ...
    document.getElementById('div100').innerHTML)
Run Code Online (Sandbox Code Playgroud)

显然,输入和维护像这样的大条件语句是有问题的.

我想要一些解决方案,如:

var conditional = "";
for(var i = 1; i <= 100; i++){
  conditional += "document.getElementById('div" + i +"').innerHTML";
  if(i < 100) {
    conditional += " && ";
  }
}
if(interpretStringAsJSExpression(conditional)){
    console.log("all my divs have content");
}
Run Code Online (Sandbox Code Playgroud)

这样的事情在JavaScript中是可能的吗?

已经提交了很好的答案,我相信我和其他人都会从中受益.但是,纯粹来自好奇的地方,是否可以在字符串中存储和运行JavaScript表达式或命令?

就像我在我的例子中提出的那样: interpretStringAsJSExpression(conditional)

Bar*_*mar 26

您可以循环执行测试.

var allOK = true;
for (var i = 1; i <= 100; i++) {
    if (!document.getElementById("div"+i).innerHTML) {
        allOK = false;
        break;
    }
}
if (allOK) {
    console.log("all my divs have content");
}
Run Code Online (Sandbox Code Playgroud)

您也可以为所有DIV提供一个公共类,然后使用内置迭代器.

var allDivs = document.getElementsByClassName("divClass");
if (Array.from(allDivs).every(div => div.innerHTML)) {
    console.log("all my divs have content");
}
Run Code Online (Sandbox Code Playgroud)


jor*_*edo 20

正如其他答案所说,您可以更轻松地解决您的条件问题.

但是,回答你的新问题

纯粹来自好奇的地方,是否可以在字符串中存储和运行JavaScript表达式或命令?

是的,您可以将JavaScript代码编写到字符串中,然后使用eval执行它.如果您担心安全性或性能,则不应该这样做.


ibr*_*rir 8

为什么要解释一串代码?还有其他方法,如for循环:

var conditionResult = true;
for(var i = 1; conditionResult && (i < 101); i++) {
    conditionResult = conditionResult && document.getElementById('div' + i).innerHTML;
}

if(conditionResult) {
    // Do something here
}
Run Code Online (Sandbox Code Playgroud)

for循环条件conditionResult && (i < 101)将打破循环一次conditionResult被确定为falsy; 在这种情况下无需保持循环.

您也可以使用数组方法some,every如果您有数组中的元素:

var arr = [/* array of DOM elements */];

var conditionResult = arr.every(elem => elem.innerHTML);   // This is equivalent to (innerHTML && innerHTML && ...)

var conditionResult = arr.some(elem => elem.innerHTML);    // This is equivalent to (innerHTML || innerHTML || ...)
Run Code Online (Sandbox Code Playgroud)