外部操作获取iframe的东西

最新推荐文章于 2021-07-15 14:22:37 发布

weixin_30736301

最新推荐文章于 2021-07-15 14:22:37 发布

阅读量217

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/lw-88238/p/8961088.html

原生js

document.iframe[id].contentWindow.document.querySelector(el).innerHTML

$(window.iframe[id].document).find(el)

转载于:https://www.cnblogs.com/lw-88238/p/8961088.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_30736301

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

网络攻防中黑客常用技术跨站脚本技术：DOM XSS高发场景透视及修复技巧、取值写入页面或动态执行、使用HTML5 postMessage进行跨域通讯、使用存在缺陷的第三方库或通用组件

代码讲故事

03-08

573

网络攻防中黑客常用技术跨站脚本技术：DOM XSS高发场景透视及修复技巧、取值写入页面或动态执行、使用HTML5 postMessage进行跨域通讯、使用存在缺陷的第三方库或通用组件。 DOM-Based XSS是一种基于文档对象模型(Document Object Model,DOM)的Web前端漏洞，简单来说就是JavaScript代码缺陷造成的漏洞。与普通XSS不同的是，DOM XSS是在浏览器的解析中改变页面DOM树，且恶意代码并不在返回页面源码中回显，这使我们无法通过特征匹配来检测DOM XSS

一些前端大牛都在学习的github库

孙叫兽的博客

03-02

2518

前端知识比较杂，长时间的工作容易沉浸在业务当中，技术提升有限，这里发现了前端的新大陆，可以帮助小伙伴们巩固基础知识，完善自己的知识体系，欢迎点赞收藏，兄弟们，赶紧干起来吧！1.JavaSc...

参与评论您还未登录，请先登录后发表或查看评论

Jquery中获取iframe的代码

12-11

父窗口中操作iframe：window.frames[“iframeChild”].document //假如iframe的id为iframeChild 在子窗口中操作父窗口：window.parent.document 那么，用如果想用jquery的方法，我们怎么用jquery来获取iframe呢？下面是一下收集来的方法。获取页面的对象其实就是dom方法外面加上jquery的选择符：父窗口中操作iframe：$(window.frames[“iframeChild”].document) //假如iframe的id为iframeChild 在子窗口中操作父窗口：$(window.pare

Jquery中获取iframe的方法

Discussing的专栏

07-14

1018

在一下网页中，一些人会用到iframe，dom获取页面中的iframe还是很简单的：父窗口中操作iframe：window.frames["iframeChild"].document //假如iframe的id为iframeChild在子窗口中操作父窗口：window.p

Jquery 获取iframe中的元素

hudeyong926的专栏

07-21

1984

由于公司项目开发中，经常会用到iframe，难免会碰到需要在父窗口中使用iframe中的元素、或者在iframe框架中使用父窗口的元素。在iframe中获取父窗口的元素 // 格式： $('#父窗口中的元素ID',parent.document).click(); // 实例： $('#btnOk',parent.document).click(); 在父窗口中获取iframe中的元素 // 格式： $("#iframe的ID").contents().find("#iframe中...

【学习】如何用jQuery获取iframe中的元素

weixin_30415801的博客

10-19

355

（我的博客网站中的原文：http://www.xiaoxianworld.com/archives/292，欢迎遇到的小伙伴常来瞅瞅，给点评论和建议，有错误和不足，也请指出。）说实在的，以前真的很少用到iframe，可最近公司把主要精力放在了研发后台系统上，所以iframe的出场就高了。今天写一个小知识，如何获取iframe中的元素。js原生方法我就不写了，毕竟还是对jquery情有独钟...

嵌套网页iframe 父子页面的数据相互读写

时光留不住，毕竟东流去

02-27

725

在父页面中获取子页面的window对象和DOM parent.html 文件 <body> <div id=‘parentDom’>parentDom</div> <iframe src="./children.html" id="iframeId" height="150" width="150"> </iframe> <...

BI模板挂载到外部系统

weixin_42426405的博客

03-02

769

一：场景描述用户有自己的门户系统A，希望将FineBI系统里面已经做好的模板直接挂载到A系统上面，使得用户可以通过一个入口查看。最终效果：登录A系统账号的同时也可以登录BI系统对应的用户账号，使得访问BI模板的时候不需要重复登录，并且BI系统设置的权限可以继承。二：适用问题三：实现方案 1、用户同步数据集 2、单点登录 3、iframe模板嵌入四、操作步骤 1、首先写...

Vue集成Iframe页面

weixin_34400525的博客

07-11

6142

1. 项目需求我们切换为vue框架是后面的事情，之前还有一些功能页面是用jsp页面写的，而我们的管理系统需要既支持Vue的url，又要支持这些发布之后的jsp页面还有一个就是切换tab回来的时候之前输入的东西还要存在系统页面截图 2. 实现思路针对这个问题，我们最开始的实现思路是写了一个iframe的通用组件，然后把不同的http的页面...

使用浏览器作为代理从公网攻击内网

neal1991的专栏

04-15

2023

介绍在Forcepoint，我们不断寻求改善我们产品所提供的防护。为此，我们经常研究不寻常或潜在新颖的攻击技术。最近的一个研究课题是从公网发起的针对localhost...

js,jquery获取iframe内控件

ImLaoCheng的博客

07-15

396

js-iframe document.querySelector("iframe[src = 'xxx']").contentWindow.document.getElementById('xxx') jquery-easyui跨iframe属性datagrid 解决方法 (1) parent.$("iframe[title='tabtitle']").contents().find("#dg").datagrid("reload"); 这种写法有些浏览器不兼容，不起作用； (2...

document获取iframe_关于iframe生成图片

weixin_39787594的博客

11-29

626

接到一个需求：在h5 parent上需要iframe嵌入第三方页面child，同时需要操作生成长图，拿着这个需求的时候，想着只要获取到第三方页面的dom元素了，利用html2canvas就能解决了，你以为就是你以为的吗？想法1: 子页面传高度给父页面为什么会有上面的的想法呢，是因为html2canvas需要width、height。width通过document.body.offsetWid...

通过Iframe在A网站页面内嵌入空白页面的方式，跨域获取B网站的数据返回给A网站！...

weixin_30260399的博客

11-25

1907

以下代码只是为演示该方法具体是如何操作的，实际的意义并不大。其实这个方法还可以解决很多方面的跨域操作，以下两点为我工作中遇到的情况！比如A系统中打开B系统页面的时候，获取B系统页面高度，A系统中可以动态设置窗口的高度还有A系统中打开B系统页面的时候，B系统页面进行一系列操作，操作成功后需关闭A系统窗口，就可以在操作成功后再在B系统中嵌入A系统的blank.html页面，blank.ht...

【WeChat】微信页面弹出键盘后iframe内容变空白

fanfan4569的博客

09-06

4997

BUG 还原当键盘弹出后，页脚也被顶起来；而当搜索完（要刷新整体页面），键盘缩回后，iframe里键盘当住的地方变成白色。前言：因为iframe要适配，so，高度要计算出来 //整体高 var win = $(window).height();//搜索栏 var header = $('header').height();//导航栏 var nav = $('.navdivw

js通过contentWindow控制iframe子页面元素点击事件,并把值传给父页面

10-01

4498

本来需要点击一个图片后,显示一个iframe上传框.点击上传,从而操作子页面中的点击上传动作,再把值传给父页面.或控制父页面中iframe元素的显示状态.不过.通过upload()函数,可以不用显示上传框了,直接激活子页面中的上传动作.另外,onchange事件则可以自动提交上传,不必用户点击上传按钮了.三步并做一步  <img src="...

jq获取iframe中的内容

最新发布

05-30

### 如何在iframe中操作父页面元素（JS跨域限制与外部交互）在iframe内部操作父页面的元素，通常需要考虑浏览器的安全策略。由于跨域限制的存在，只有当iframe和父页面位于同一域名、协议和端口时，才能直接通过`window.parent`或`window.top`访问父页面的DOM元素[^1]。以下是一个非跨域场景下的代码示例，展示如何从iframe内部操作父页面的元素： ```javascript // iframe内部脚本 document.addEventListener("DOMContentLoaded", function () { // 获取父页面中的某个元素，并修改其内容 let parentElement = window.parent.document.getElementById("parentElementId"); if (parentElement) { parentElement.textContent = "来自iframe的修改"; } }); ``` 如果遇到跨域问题，则无法直接使用上述方法访问父页面的DOM。此时可以采用`postMessage` API来实现安全的跨域通信[^3]。以下是基于`postMessage`的解决方案： #### 父页面代码 ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>父页面</title> </head> <body> <div id="parentElement">初始内容</div> <iframe id="iframe" src="http://example.com/iframe.html" width="600" height="400"></iframe> <script> // 接收来自iframe的消息 window.addEventListener("message", function (event) { // 验证消息来源是否可信 if (event.origin !== "http://example.com") return; // 根据消息内容执行操作 document.getElementById("parentElement").textContent = event.data; }); </script> </body> </html> ``` #### iframe页面代码 ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>iframe页面</title> </head> <body> <button id="sendButton">发送消息给父页面</button> <script> document.getElementById("sendButton").addEventListener("click", function () { // 向父页面发送消息 window.parent.postMessage("来自iframe的消息", "http://localhost"); }); </script> </body> </html> ``` 通过上述方式，即使iframe与父页面处于不同域名下，也可以安全地传递信息并间接操作父页面的元素[^2]。 ### 注意事项 - 在跨域场景下，必须明确指定目标窗口的源（origin），以确保通信的安全性。 - 父页面需要监听`message`事件，并验证消息来源，避免潜在的安全风险。 - 如果双方不在同一域名下，但可以通过配置CORS或其他方式实现资源共享，则可以直接访问DOM。