Managing Windows and Frames

open(url, target, features) loads a URL into a new tab, popup or named window and returns its WindowProxy: const win = open('/help.html', 'help', 'popup,width=480,height=600'). Poll win.closed to see when it closes. Popup blockers allow open() only in response to a user gesture.

In the frame tree, self is the current window, parent the enclosing one, top the outermost, frames[i] a child <iframe> (length counts them) and opener the window that called open().

Navigating the frame tree from both sidesHTMLLive

<p id="out"></p>
<iframe name="child" height="50" width="520" srcdoc="<body><script>
  document.body.textContent = `in frame: name=${name}, parent === top: ${parent === top},
    frameElement: ${frameElement.tagName}`;
</script></body>"></iframe>
<script>
  addEventListener('load', () => document.querySelector('#out').textContent =
    `in page: length=${length}, frames[0].name=${frames[0].name}, top === self: ${top === self}`);
</script>

Browser output of 5

A cross-origin window exposes only a safelist of members, such as closed, parent, top and postMessage(). Links with target="_blank" imply rel="noopener", so the new page sees opener === null.

MENU

Managing Windows and Frames