0

This works:

parent.document.getElementById('iframeID').contentWindow.document.querySelectorAll('*[id^="elementId"]');

But this doesn't:

parent.document.getElementById('iframeID').querySelectorAll('*[id^="elementId"]');

According to querySelectorAll's reference:

The Element method querySelectorAll() returns a static (not live) NodeList representing a list of elements matching the specified group of selectors which are descendants of the element on which the method was called.

If contentWindow is a descendant of the iframe element, shouldn't the iframe element be recursively iterated until, eventually, contentWindow and document are encountered, as it is the case with, for example:

<div id="div1">
  <div id="div2">
    <div id="div3">
      <div id="div4">
        <div id="div5">

        </div>
      </div>
    </div>
  </div>
</div>


<script>
console.log(document.getElementById("div1").querySelectorAll('div'));
</script>
4
  • 3
    I'm not sure what kind of answer you're looking for; it doesn't work that way because it was not designed to work that way. There's a "boundary" between the DOM in the parent document and the DOM in the frame, and DOM queries from any element in the parent tree do not descend into any frame DOM encountered. Commented Mar 3 at 15:07
  • 1
    That said, I have a vague recollection of some feature proposal, years ago, that would optionally unify the parent and child DOM trees. I remember almost nothing about that and it might be fictional. Commented Mar 3 at 15:08
  • 3
    "If contentWindow is a descendant of the iframe element" ... "if" ... it's not. It's a property. Commented Mar 3 at 15:09
  • @fdomn-m got it. Commented Mar 3 at 15:50

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.