iframe的document操作
导语:
在我写网页代填插件的时候,有遇到拿不到input元素的时候,这时候我去看元素布局,发现有些网站登录那一块是用iframe标签写的,这时候我需要取到的那就是iframe标签下input元素
1.获取页面上的所有iframe标签遍历获取每一个iframe
- 获取所有的iframe标签
let iframes = document.getElementsByTagName("iframe");
- 遍历获取单个iframe
for (let i = 0; i < iframes.length; i++) {
let iframeId = iframes[i].id;
let currentIframe = document.getElementById(iframeId);
}
取完整iframe元素必须用getElementById的方法获取。
2.获取iframe下document元素
let currentDoc = currentIframe.contentDocument || currentIframe.contentWindow.document
这里主要拿到iframe的document操作元素,有些浏览器可以直接contentDocument获取document操作元素,有些需要通过contentWindow.document获取
3.获取iframe中输入框
let inputs = currentDoc.getElementsByTagName("input");
这样就能获取iframe所有的输入框标签。
*注意:当iframe跨域的时候,就无法获取iframe的document操作。
链接:https://www.jianshu.com/p/9809cd8188dd
iframe的document操作的更多相关文章
- x-frame-options、iframe与iframe的一些操作
iframe的子操作父窗口,父操作子窗口: test.php: <!DOCTYPE html> <html> <head> <title>test< ...
- JavaScript对iframe的DOM操作
在IE6.IE7中,我们可以使用 document.frames[ID].document 来访问iframe子窗口中的document对象,可是这是不符合W3C标准的写法,也是IE下独有的方法,在F ...
- iframe的Dom操作
我最近遇到这样一个需求, 抛开业务相关不谈,但从技术上说:页面中选择公司中的页面,在iframe中展示被选的页面,并且要对页面做一些Dom相关的处理.也就是说我们需要在父级页面中操作子页面(ifram ...
- 基本的window.document操作及实例
基本的window.document操作及实例 找元素 1.根据id找 var d1 = document.getElementById("d1"); alert(d1); 2.根 ...
- 多个iframe中根据src获取特定iframe并执行操作
多个iframe中根据src获取特定iframe并执行操作 前言:在项目中做一个批量编辑工单时需要在一大堆的iframe中的某一个iframe里边再用模态框的形式显示编辑区域,然后再在模态框里边加入i ...
- 对frameset、frame、iframe的js操作
框架编程概述一个HTML页面可以有一个或多个子框架,这些子框架以<iframe>来标记,用来显示一个独立的HTML页面.这里所讲的框架编程包括框架的自我控制以及框架之间的互相访问,例如从一 ...
- 跨域-jsonp、cors、iframe、document.domain、postMessage()
同源策略 概念:同源: 协议.域名.端口号 完全相同 同源策略是浏览器的一种安全策略:且浏览器不会将违反同源策略的响应信息返回 http://127.0.0.1:3000/index.html ...
- iframe内外的操作
因为iframe涉及到跨域问题,有时候有的比较多,这不今天遇到了一个问题,处在iframe里头的js要操作iframe元素,查找百度,是可以实现的: 用jQuery在IFRAME里取得父窗口的某个元素 ...
- document操作
1.windows对象操作 事件两个参数sender:代表事件源,即谁触发的事件e:代表事件数据load(sender,e)事件是一个特殊的委托(代理)2.document对象操作找元素:1.根据id ...
随机推荐
- PostgreSQL - raise函数打印字符串
raise函数 在PostgreSQL中,该函数用于打印字符串,类似于Java中的System.out.println(),Oracle中的dbms_output.put_line(). 用法如下: ...
- Django框架之MVT(1)
Django框架之MVT 灌输: 什么是根目录:就是没有路径,只有域名. url(r”^$”) 一. MVT模型 Django的MVT模型 - Model(模板):和数据库相关,负责 ...
- Django之Form自定义验证规则
1.数据源无法时时更新,有两种方法 方式一:重构构造方法(推荐) 方法一:重构构造方法(推荐) class ClassesForm(Form): name = fields.CharField( re ...
- Codeforces 140F(坐标系点对称)
要点 结论:如果坐标系一堆点两两对称于某一重心,则排序后第1个和第n个为一对,以此类推. 枚举所有可能的重心点并check.因为隐藏的点不超过k个,所以点1-k+1都可能跟第n个匹配.对右侧同样适用, ...
- Hive进阶_Hive数据查询
简单查询和fetch task 简单查询: 简单查询的 fetch task 功能,从HDFS拉取,不用map reduce. 前两种配置,当前session有效.修改hive-site.xml永 ...
- HTML标签的三种类型
HTML标签的类型分为三种:行内元素,行内块元素,块级元素 而标签的属性是可以转换的 display:inline: 转换为行内元素 display:linline-block 转换为行内块元素 di ...
- Netty(2)Echo
上节介绍的是discard协议,即不给客户端返回消息.本节主要说下,echo协议,即服务端收到消息后原样返回给客户端. 为了实现此需求,只需要在DiscardServerHandler中重写chann ...
- NET CORE 基础
NET CORE 基础管理系统 [SF]开源的.NET CORE 基础管理系统 - 安装篇 [SF]开源的.NET CORE 基础管理系统 -系列导航 1.开发必备工具 IDE:VS2017 运行 ...
- jeesite框架搭建中mysql数据库导入问题
在进行mysql8.0的安装配置时,可以说是道路坎坷,之前介绍了如何安装配置mysql8.0,虽然mysql在正常情况下是很容易安装的,但是如果遇到特殊情况的时候那就需要特殊的处理. 这次我遇到的问题 ...
- Java虚拟机内存分配与回收策略
内存分配与回收策略 Minor GC 和 Full GC Minor GC:发生在新生代上,因为新生代对象存活时间很短,因此 Minor GC 会频繁执行, 执行的速度一般也会比较快. Full GC ...