Buildfire技术问询：如何获取iframe的source ID或name？

一、查找iframe的ID或Name #

方法1：直接查看网页源码 #

• 打开目标页面，右键选「查看页面源代码」（快捷键：Windows按Ctrl+U，Mac按Cmd+Opt+U）
• 搜索<iframe关键字，找到对应标签后，直接读取id="xxx"或name="xxx"的内容，示例：

  <iframe id="pay-frame" name="order-iframe" src="https://example.com/pay"></iframe>
  

  这里pay-frame是ID，order-iframe是Name。

方法2：用浏览器开发者工具定位 #

• 打开开发者工具（快捷键：F12或Mac按Cmd+Opt+I），切到「元素」面板
• 在页面上右键点击目标iframe，选「检查」，面板里会直接高亮对应的iframe标签，查看id和name属性即可
• 若iframe是动态加载的，可去「网络」面板筛选「文档」类型，找到该iframe的请求后，查看响应内容里的标签属性

二、在代码中标记iframe的Source ID #

针对Apple设备的插件问题，直接在iframe标签里明确添加id属性即可，示例：

<!-- 未标记的iframe -->
<iframe src="https://your-plugin-url.com"></iframe>

<!-- 添加Source ID后的iframe -->
<iframe id="apple-plugin-iframe" src="https://your-plugin-url.com"></iframe>

之后插件代码就能通过document.getElementById('apple-plugin-iframe')精准定位这个iframe，解决兼容问题。

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