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


Posted in Javascript onMay 20, 2016

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实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
模拟多级复选框效果的jquery代码
Aug 13 Javascript
页面图片浮动左右滑动效果的简单实现案例
Feb 10 Javascript
JavaScript中使用ActiveXObject操作本地文件夹的方法
Mar 28 Javascript
js中将String转换为number以便比较
Jul 08 Javascript
node.js中的fs.fstatSync方法使用说明
Dec 15 Javascript
javascript常用的方法分享
Jul 01 Javascript
BootStrap的弹出框(Popover)支持鼠标移到弹出层上弹窗层不隐藏的原因及解决办法
Apr 03 Javascript
浅谈JS原生Ajax,GET和POST
Jun 08 Javascript
浅谈jquery页面初始化的4种方式
Nov 27 Javascript
微信小程序wx.getImageInfo()如何获取图片信息
Jan 26 Javascript
JavaScript中变量、指针和引用功能与操作示例
Aug 04 Javascript
微信小程序 (地址选择1)--选取搜索地点并显示效果
Dec 17 Javascript
Bootstrap3学习笔记(二)之排版
May 20 #Javascript
js获取iframe中的window对象的实现方法
May 20 #Javascript
BootStrap3学习笔记(一)之网格系统
May 20 #Javascript
有关JavaScript中call()和apply() 的一些理解
May 20 #Javascript
Bootstrap表格和栅格分页实例详解
May 20 #Javascript
JavaScript 数组some()和filter()的用法及区别
May 20 #Javascript
JS数组操作(数组增加、删除、翻转、转字符串、取索引、截取(切片)slice、剪接splice、数组合并)
May 20 #Javascript
You might like
pw的一个放后门的方法分析
2007/10/08 PHP
php设计模式 Factory(工厂模式)
2011/06/26 PHP
深入探讨PHP中的内存管理问题
2011/08/31 PHP
ThinkPHP查询中的魔术方法简述
2014/06/25 PHP
PHP命令行脚本接收传入参数的三种方式
2014/08/20 PHP
页面利用渐进式JPEG来提升用户体验度
2014/12/01 PHP
为指定元素增加样式的js代码
2009/12/09 Javascript
关于 文本框默认值 的操作js代码
2012/01/12 Javascript
jQuery.getScript加载同域JS的代码
2012/02/13 Javascript
jQuery+JSON+jPlayer实现QQ空间音乐查询功能示例
2013/06/17 Javascript
div浮层,滚动条移动,位置保持不变的4种方法汇总
2013/12/11 Javascript
javascript正则表达式中的replace方法详解
2015/04/20 Javascript
jQuery实现的简单折叠菜单(折叠面板)效果代码
2015/09/16 Javascript
如何利用AngularJS打造一款简单Web应用
2015/12/05 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
2016/07/01 Javascript
AngularJs验证重复密码的方法(两种)
2016/11/25 Javascript
微信小程序 实战程序简易新闻的制作
2017/01/09 Javascript
ES6 迭代器(Iterator)和 for.of循环使用方法学习(总结)
2018/02/08 Javascript
微信小程序生成海报分享朋友圈的实现方法
2019/05/06 Javascript
详解Python中的__init__和__new__
2014/03/12 Python
python中lambda函数 list comprehension 和 zip函数使用指南
2014/09/28 Python
python字符串string的内置方法实例详解
2018/05/14 Python
Python实现的建造者模式示例
2018/08/06 Python
解决安装pyqt5之后无法打开spyder的问题
2019/12/13 Python
Python lxml模块的基本使用方法分析
2019/12/21 Python
django 实现简单的插入视频
2020/04/07 Python
python爬虫实现POST request payload形式的请求
2020/04/30 Python
仓库主管的岗位职责
2013/12/04 职场文书
应届毕业生自我评价分享
2013/12/15 职场文书
自我评价个人范文
2013/12/16 职场文书
数学考试作弊检讨书300字
2015/02/16 职场文书
公司保洁员管理制度
2015/08/04 职场文书
青年干部培训班学习心得体会
2016/01/06 职场文书
Oracle创建只读账号的详细步骤
2021/06/07 Oracle
Win10鼠标轨迹怎么开 Win10显示鼠标轨迹方法
2022/04/06 数码科技
浅谈Redis的事件驱动模型
2022/05/30 Redis