mjhjmtu

Let's assume for a moment that I have something like this:

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)

Obviously typing out and maintaining a big conditional statement like this is problematic.

I would like some solution like:

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");

Is something like this possible in JavaScript?

Great answers have been submitted, and I am sure that I and others will benefit from them. However, purely from a place of curiosity, is it possible to store and run JavaScript expressions or commands in strings?

Like I have proposed in my example: interpretStringAsJSExpression(conditional)

As the other answers said, you can solve your conditions problem more easily.

But, to answer your new question

purely from a place of curiosity, is it possible to store and run
JavaScript expressions or commands in strings?

Yes, you can write JavaScript code to a string and execute it later with eval. Which you should not do if you are concerned with security or performance.

You can do the tests in a loop.

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");

You could also give all your DIVs a common class, then use a built-in iterator.

var allDivs = document.getElementsByClassName("divClass");
if (Array.from(allDivs).every(div => div.innerHTML)) 
 console.log("all my divs have content");

Why interpret a string of code? There are other means like for loops:

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


if(conditionResult) 
 // Do something here

The for loop condition conditionResult && (i < 101) will break the loop once conditionResult is determined to be falsy; no need to keep looping in this case.

You can also use array methods like some and every if you have the elements in an array:

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 || ...)

You can set condition to true and check each one, setting condition to false and break out of the loop if any are false.

var conditional = true;
for(var i = 1; i <= 100; i++)
 if (!document.getElementById('div' + i).innerHTML) 
 condition = false;
 break;
 

Use document.querySelectorAll for this type of operation

// Get all the divs that have ids which start with div
var theDivs = document.querySelectorAll('[id^="div"]');
var i,l,el,divsWithContent = ;

// Loop through all theDivs
l = theDivs.length;
for(i = 0; i < l; i++) 
 // el is the div 
 el = theDivs[i];
 
 // Test to make sure the id is div followed by one or more digits
 if (/^divd+$/.test(el.id)) 
 // If the div has something in it other than spaces, it's got content
 if (el.textContent.trim() !== "") 
 // Save the divs with content in the array
 divsWithContent.push(el.id);
 
 


// Show the results 
document.getElementById("result").textContent = divsWithContent.join("n");

<h1>Div test</h1>
<div id="div1">This</div>
<div id="div2">that</div>
<div id="div3"></div>
<div id="div4">and</div>
<div id="div5">the other thing</div>
<h2>Divs with content</h2>
<pre id="result"></pre>

Ref: https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll

You could just store the document.getElementById('divXX').innerHTML items in an array, and then, just use

items.reduce((a, b) => a && b);

That way, you can change individual div elements in your expression without having to re-created the whole list