如何获取当前iframe的ID或名称？PHP页面嵌入多iframe的场景求助

原生JavaScript实现 #

直接通过window.frameElement获取当前页面所在的iframe元素，再读取其id或name属性：

const currentIframe = window.frameElement;
if (currentIframe) {
    const iframeId = currentIframe.id;
    const iframeName = currentIframe.name;
    console.log('当前iframe ID:', iframeId);
    console.log('当前iframe 名称:', iframeName);
} else {
    console.log('当前页面未嵌入iframe');
}

jQuery实现 #

将原生的iframe元素转为jQuery对象后操作：

const $iframe = $(window.frameElement);
if ($iframe.length) {
    const iframeId = $iframe.attr('id');
    const iframeName = $iframe.attr('name');
    console.log('当前iframe ID:', iframeId);
    console.log('当前iframe 名称:', iframeName);
} else {
    console.log('当前页面未嵌入iframe');
}

关键注意点 #

• 同源限制：如果父页面和iframe页面的协议、域名、端口任意一项不同，浏览器的同源策略会禁止iframe访问父DOM，此时window.frameElement会返回null。这种情况需要通过父页面主动传递标识：
  1. 父页面加载iframe时，在URL后拼接参数（比如iframe.php?iframeId=frame1），然后iframe内通过window.location.search解析参数；
  2. 父页面通过postMessage向iframe发送iframe标识，iframe监听message事件接收。
• 兼容性：window.frameElement支持所有现代浏览器及IE9+，无需额外兼容处理。

内容的提问来源于stack exchange，提问作者eluc