快速获取与设置iframe内元素对象的几种JS实现方式

IE专用的frames定位方法

1、IE专用(通过frames索引形象定位)： document.frames[i].document.getElementById('元素的ID');

2、IE专用(通过IFRAME名称形象定位)： document.frames['iframe的name'].document.getElementById('元素的ID');

上述方法不仅适用于IFRAME，同样适用于FRAMESET中的FRAME。尽管IE常因自行制定标准而受争议，但其部分设计确实体现了人性化考量。例如，在支持标准路径的同时，它提供了一种简洁且直观的写法。

通用contentWindow访问路径

3、通用方法： document.getElementById('iframe的ID').contentWindow.document.getElementById('元素的ID')

需注意必须添加contentWindow，许多问题往往源于忽略此属性，它代表了FRAME和IFRAME内部的窗口对象。

然而，这种写法显然过于冗长。若需操作多个内部元素，如此书写将极为繁琐，即便使用复制粘贴，视觉上也令人不适。

简化DOM获取的封装技巧

4、通用方法的简写：

为document.getElementById定义一个短名称，熟悉JS的朋友对此并不陌生。在此场景下，它可发挥双重作用，示例如下：

var $id=document.getElementById;
$Id('iframe的ID').contentWindow.$Id('元素的ID') //这样就得到了要取的对象

在此方面，我更倾向于IE的做法，因其更具包容性。微软并非单一的浏览器开发商，其自身也大量编写HTML/ASP等文档，故能兼顾此点。而其他浏览器开发商多仅从浏览器立场出发，确保基本链路畅通即可，较少从开发者角度设计此类简便且具语义化的捷径。许多人常提及“标准”，虽有一定道理，但有时这种标准显得冷漠。

以上这篇快速获取/设置iframe内对象元素的几种js实现方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持本站。