导语:

在我写网页代填插件的时候,有遇到拿不到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操作的更多相关文章

  1. x-frame-options、iframe与iframe的一些操作

    iframe的子操作父窗口,父操作子窗口: test.php: <!DOCTYPE html> <html> <head> <title>test< ...

  2. JavaScript对iframe的DOM操作

    在IE6.IE7中,我们可以使用 document.frames[ID].document 来访问iframe子窗口中的document对象,可是这是不符合W3C标准的写法,也是IE下独有的方法,在F ...

  3. iframe的Dom操作

    我最近遇到这样一个需求, 抛开业务相关不谈,但从技术上说:页面中选择公司中的页面,在iframe中展示被选的页面,并且要对页面做一些Dom相关的处理.也就是说我们需要在父级页面中操作子页面(ifram ...

  4. 基本的window.document操作及实例

    基本的window.document操作及实例 找元素 1.根据id找 var d1 = document.getElementById("d1"); alert(d1); 2.根 ...

  5. 多个iframe中根据src获取特定iframe并执行操作

    多个iframe中根据src获取特定iframe并执行操作 前言:在项目中做一个批量编辑工单时需要在一大堆的iframe中的某一个iframe里边再用模态框的形式显示编辑区域,然后再在模态框里边加入i ...

  6. 对frameset、frame、iframe的js操作

    框架编程概述一个HTML页面可以有一个或多个子框架,这些子框架以<iframe>来标记,用来显示一个独立的HTML页面.这里所讲的框架编程包括框架的自我控制以及框架之间的互相访问,例如从一 ...

  7. 跨域-jsonp、cors、iframe、document.domain、postMessage()

    同源策略 概念:同源: 协议.域名.端口号 完全相同 同源策略是浏览器的一种安全策略:且浏览器不会将违反同源策略的响应信息返回 http://127.0.0.1:3000/index.html     ...

  8. iframe内外的操作

    因为iframe涉及到跨域问题,有时候有的比较多,这不今天遇到了一个问题,处在iframe里头的js要操作iframe元素,查找百度,是可以实现的: 用jQuery在IFRAME里取得父窗口的某个元素 ...

  9. document操作

    1.windows对象操作 事件两个参数sender:代表事件源,即谁触发的事件e:代表事件数据load(sender,e)事件是一个特殊的委托(代理)2.document对象操作找元素:1.根据id ...

随机推荐

  1. E20190420-hm

    impact n. 巨大影响; 强大作用; 撞击; 冲撞; 冲击力;      v. (对某事物) 有影响,有作用; 冲击; 撞击; incident  n. 发生的事情(尤指不寻常的或讨厌的); 严 ...

  2. UGUI CanvasGroup

    说明,这种直接设置alpha的方法跟go的setActive(false)性能差不多,只少了激活和冻结冻结调用 http://blog.csdn.net/qq_28824335/article/det ...

  3. 洛谷P1587 [NOI2016]循环之美

    传送门 不会,先坑着 https://kelin.blog.luogu.org/solution-p1587 //minamoto #include<cstdio> #include< ...

  4. thinkphp5部署到LAMP服务器显示Access denied.

    问题:thinkphp5部署到LAMP服务器,首页正常访问,其余页面访问显示Access denied 解决:1.先把文件夹权限改为777 2. 进入服务器,改文件.将php.ini的值改成1

  5. VxWorks实验六 基于优先级的抢占式调度及实验的源程序和实验步骤

    基于优先级的抢占式调度及实验的源程序和实验步骤 1 实验目的    1.学习并验证基于优先级的抢占式调度2 实验内容    在实验一建立的 project 中,创建3 个任务,对这三个任务使用基于优先 ...

  6. js 中止程序继续进行(break continue return throw)

    1.break 跳出循环 2.continue 跳出本次循环,进入下次循环 3.return 中止当前函数继续执行 4.throw 异常信息;中止程序抛出异常,可用于中止程序

  7. [Android]解决 Could not read entry xxx from cache taskArtifacts.bin

    Bug 出现 事情是这样的,昨天早晨我正做着项目,坐在我旁边的小伙伴呼唤了我一下,说项目运行不起来了. 我纳闷着,前天的时候还好好的,怎么过了一晚就出问题了.我问他是不是改了什么配置,或者添加了什么东 ...

  8. 泛型设计<T, PK extends Serializable>

    泛型类和泛型方法的使用 http://www.jb51.net/article/67445.htm http://www.cnblogs.com/iyangyuan/archive/2013/04/0 ...

  9. c++11 thread的学习

    http://www.cnblogs.com/wxquare/p/6736202.html 还没开始 留个链接 使用c++11 thread支持实现  一个生产者消费者模型 下面是一个生产者消费者问题 ...

  10. Redis的数据类型(lists、Sets)

    lists类型 Redis 列表是简单的字符串列表,按照插入顺序排序.你可以添加一个元素到列表的头部(左边)或者尾部(右边) LPUSH 命令插入一个新的元素到头部, 而 RPUSH 插入一个新元素导 ...