快速获取/设置iframe内对象元素的几种js实现方法

 更新时间:2016年05月20日 11:34:23   投稿:jingxian  
下面小编就为大家带来一篇快速获取/设置iframe内对象元素的几种js实现方法。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

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

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

以上方法,不仅对IFRAME适用,对FRAMESET里的FRAME也同样适用。IE虽然擅于自定标准,但不得不说它很多的设计还是比较体现人性化的。比如这个,它在同样支持下面的标准路径之外,提供了一个简洁且形象化的写法。

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

注意要加上contentWindow,往往出现问题都是因为这个容易被忽略,它代表FRAME和IFRAME内部的窗口对象。

但是,很明显,这种写法非常要命,太长了。如果要操作一系列里面的元素,这样写起来,实在够受的,就算用复制粘贴大法,眼睛看起来也是个问题。

4、通用方法的简写:

对document.getElementById定义一个短名称,稍微熟悉JS的朋友都知道这个方法。在这里它可以发挥双倍的作用,如下例:

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

在这一点上,我还是喜欢IE的做法,比较呵护。因为微软不是一个单独的浏览器开发商,它本身也要大量地编写开发HTML/ASP等文档,所以比较能够做到这一点。而其它的浏览器开发商,基本只是站在一个浏览器的立场,把最基本的链路走通就完事了,很少站在开发者立场去设计出一些类似这样既简便又不失语义化的捷径来。很多人动辄说它们“标准”,在有些地方固然有理,但在有些地方,这种标准也不过是一种冷漠。

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

相关文章

  • 基于JS实现的笛卡尔乘积之商品发布

    基于JS实现的笛卡尔乘积之商品发布

    本文给大家介绍JS实现的笛卡尔乘积之商品发布的相关内容,涉及到js笛卡尔积算法的相关知识,本文介绍的非常详细,具有参考价值,感兴趣的朋友一起学习吧
    2016-05-05
  • JavaScript实现网页动态生成表格

    JavaScript实现网页动态生成表格

    这篇文章主要为大家详细介绍了JavaScript实现网页动态生成表格,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-11-11
  • 微信小程序跳转到其他网页(外部链接)的实现方法

    微信小程序跳转到其他网页(外部链接)的实现方法

    这篇文章主要介绍了微信小程序跳转到其他网页(外部链接)的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-09-09
  • 基于rollup的组件库打包体积优化小结

    基于rollup的组件库打包体积优化小结

    这篇文章主要介绍了基于rollup的组件库打包体积优化小结,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-06-06
  • JavaScript 封装一个tab效果源码分享

    JavaScript 封装一个tab效果源码分享

    本文给大家分享javascript封装一个tab效果源码分享,感兴趣的朋友一起来看看吧
    2015-09-09
  • 浅谈Javascript数组(推荐)

    浅谈Javascript数组(推荐)

    数组,即Array类型,是开发中最常用的类型之一。这篇文章主要介绍了浅谈Javascript数组的相关资料,需要的朋友可以参考下
    2016-05-05
  • 用IE重起计算机或者关机的示例代码

    用IE重起计算机或者关机的示例代码

    本篇文章主要是对用IE重起计算机或者关机的实现代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-03-03
  • 浅谈js二维码扫码登录是什么原理

    浅谈js二维码扫码登录是什么原理

    这篇文章主要介绍了浅谈js二维码扫码登录是什么原理,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-04-04
  • JSON的parse()方法介绍

    JSON的parse()方法介绍

    今天小编就为大家分享一篇关于JSON的parse()方法介绍,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2019-01-01
  • Textarea与懒惰渲染实现代码

    Textarea与懒惰渲染实现代码

    2008年有啊第一次性能优化时,我们曾用textarea来存贮需要懒惰渲染的节点
    2012-01-01

最新评论