How to find an element which starts with something and also ends with something with `document.querySelectorAll`?

Question

There are some elements whose class have a pattern of:

view-???-panel

Like:

<iframe name="view-111-panel"></iframe>
<iframe name="view-112-panel"></iframe>

I want to use document.querySelectorAll to find them. I know to how to query with "startsWith" and "endsWith":

document.querySelectorAll('iframe[name^="view-"]')
document.querySelectorAll('iframe[name$="-panel"]')

But I can't find a way to combine them together.

Is it possible to do it all by querySelectorAll?

Answer 1

You CAN combine selectors document.querySelectorAll('iframe[name^="view-"][name$="-panel"]') https://api.jquery.com/multiple-attribute-selector/ (vanilla JS is the same)