Universal String selector for Javascript?

Question

I have something like

x.getElementById("foo" + rowIndex);

There are a couple of cases that have some other string before the "foo" in the ID, and my question is if there are any replacements (like the "%" in SQL) that I could use to add something else to the "foo" like

x.getElementById("%foo" + rowIndex);

Answer 1

If you use querySelector instead of getElementById , you can pass a selector string that selects an ID which ends with the substring you want, for example:

x.querySelector('[id$="foo' + rowIndex + '"]');

 const rowIndex = 3; console.log(document.querySelector('[id$="foo' + rowIndex + '"]')); 

 <div id="barfoo3">text</div> 

(of course, if you want to select all elements whose ID ends with that, use querySelectorAll instead of querySelector )

That said, note that such dynamic IDs are somewhat of a code smell - you might consider if there are more elegant alternative methods.