How to check if an element is inside an iframe or not

Question

Let's say you have a DOM node and you want to know whether it is located inside an iframe or not. One way would be to check it's parent chain to see if you reached an iframe before reaching the parent window. However, I'd like to know if there is a faster way to do this.

• The Alpha: Make a fiddle with your html.
• user730569: @SheikhHeera That won't help. Just know that I am given a random DOM node from a mutation event, and I want a quick way to know if it is inside an iframe.
• The Alpha: You want to check the node's existence from the parent page ?
• Felix Kling: Any events inside iframes are normally not propagated to the parent document, so how can you get a reference to a node inside an iframe (not even speaking of iframes from different domains)? Or do you want to test whether the whole page was loaded into an iframe? Testing the ownerDocument property might work, but it's hard to tell without more information / an example.
• Felix Kling: @widged: Yeah, the link to the jQuery solution makes sense, but the first two links referring to testing self and top are not useful in this context.

Answer 1

You could probably check the ownerDocument property of the node:

if(node.ownerDocument !== document) {
 // node must be inside iframe
}

• user730569: thanks, is there also a fast way to get a reference of the iframe it is inside, or do I need to iterate through all iframes?
• Felix Kling: You can use document.defaultView and window.frameElement: node.ownerDocument.defaultView.frameElement (doesn't seem to work in IE and below though).
• KenneyE: Unfortunately, this won't work if the script you are running is also in an iFrame. This will only indicate whether or not the element is in the same document as the script.

Answer 2

Another simple way is:

const isIframe = window.top !== window.self;

Answer 3

The best way that works for me is const isElementInsideIframe = document.location.ancestorOrigins.length https://developer.mozilla.org/en-US/docs/Web/API/Location/ancestorOrigins