快速获取/设置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 相关文章推荐
用javascript实现的图片马赛克后显示并切换加文字功能
Apr 21 Javascript
jQuery遍历Form示例代码
Sep 03 Javascript
JavaScript中的索引数组、关联数组和静态数组、动态数组讲解
Nov 08 Javascript
jQuery插件Tooltipster实现漂亮的工具提示
Apr 12 Javascript
Javascript非构造函数的继承
Apr 27 Javascript
javascript去除空格方法小结
May 21 Javascript
JS组件中bootstrap multiselect两大组件较量
Jan 26 Javascript
JavaScript中return用法示例
Nov 29 Javascript
vue通过watch对input做字数限定的方法
Jul 13 Javascript
Net微信网页开发 使用微信JS-SDK获取当前地理位置过程详解
Aug 26 Javascript
webpack proxy 使用(代理的使用)
Jan 10 Javascript
ant design vue导航菜单与路由配置操作
Oct 28 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
用php实现批量查询清除一句话后门的代码
2008/01/20 PHP
MySql 按时间段查询数据方法(实例说明)
2008/11/02 PHP
PHP按行读取、处理较大CSV文件的代码实例
2014/04/09 PHP
php实现在线通讯录功能(附源码)
2016/05/13 PHP
Laravel 验证码认证学习记录小结
2019/12/20 PHP
javascript 常用代码技巧大收集
2009/02/25 Javascript
js 省地市级联选择
2010/02/07 Javascript
JS如何将UTC格式时间转本地格式
2013/09/04 Javascript
使用AngularJS制作一个简单的RSS阅读器的教程
2015/06/18 Javascript
js检测离开或刷新页面时表单数据是否更改的方法
2016/08/02 Javascript
解决vue2.x中数据渲染以及vuex缓存的问题
2017/07/13 Javascript
浅谈vue 单文件探索
2018/09/05 Javascript
JS基于开关思想实现的数组去重功能【案例】
2019/02/18 Javascript
js 根据对象数组中的属性进行排序实现代码
2019/09/12 Javascript
使用layui定义一个模块并使用的例子
2019/09/14 Javascript
JS实现简单tab选项卡切换
2019/10/25 Javascript
浅谈vuex的基本用法和mapaction传值问题
2019/11/08 Javascript
vue 判断页面是首次进入还是再次刷新的实例
2020/11/05 Javascript
Android模拟器无法启动,报错:Cannot set up guest memory ‘android_arm’ Invalid argument的解决方法
2016/07/01 Python
Python实现Mysql数据库连接池实例详解
2017/04/11 Python
python 删除大文件中的某一行(最有效率的方法)
2017/08/19 Python
Python3实现腾讯云OCR识别
2018/11/27 Python
简单了解python中对象的取反运算符
2019/07/01 Python
浅谈Python3识别判断图片主要颜色并和颜色库进行对比的方法
2019/10/25 Python
tensorflow与numpy的版本兼容性问题的解决
2021/01/08 Python
韩国商务邀请函
2014/01/14 职场文书
开展批评与自我批评发言材料
2014/05/15 职场文书
个人自荐材料
2014/05/23 职场文书
影视广告专业求职信
2014/09/02 职场文书
酒店工程部岗位职责
2015/02/12 职场文书
教师专业技术工作总结2015
2015/05/13 职场文书
交通事故案件代理词
2015/05/23 职场文书
少先队中队工作总结2015
2015/07/23 职场文书
2016年度基层党建工作公开承诺书
2016/03/25 职场文书
2016年“6.26”禁毒宣传月系列活动总结
2016/04/05 职场文书
js面向对象编程OOP及函数式编程FP区别
2022/07/07 Javascript