[html] iframe可以使用父页面中的资源吗（如：css、js等）？

最新推荐文章于 2023-04-07 17:21:57 发布
最新推荐文章于 2023-04-07 17:21:57 发布
阅读量913 收藏
点赞数 1
分类专栏： # HTML面试题汇总
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43392489/article/details/115485185
版权
本文探讨了iframe是否能使用父页面资源的问题，指出iframe作为一个独立文档无法直接利用父页面CSS和JS，但同域情况下可通过parent对象进行JS交互。作者歌谣分享了前端知识，并鼓励大家坚持学习，共同讨论前端面试题目。
摘要由CSDN通过智能技术生成

[html] iframe可以使用父页面中的资源吗（如：css、js等）？


    iframe 属于一个单独的文档不能直接使用父页面的资源，css的层叠不会影响iframe
    iframe如果和父页面同域则可以在iframe中使用parent对象来使用父页的js对象

个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题

前端小歌谣
关注
专栏目录
iframe引用父页面样式_iframe中父项的样式
cunbei2644的博客
09-27 1454
Here's a JavaScript that let's you style an iframe just like its top parent. The script is basically just a proof of concept I did after talking to a friend about similar problem he has had in the pas...
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
12-03
当你需要刷新当前页面时，可以使用`document.location.reload()`，这将重新加载当前页面的所有资源，包括JavaScript、CSS和HTML。而刷新上级页面（如果当前页面在框架或iframe中）则可以通过`window.parent`属性来...
子页面访问父页面 和 跨iframe访问
03-15
NULL 博文链接：https://pireswang.iteye.com/blog/325571
iframe继承父窗口样式CSS/JS的方法
qq_39539221的博客
06-23 2541
<script> window.parent.$(function () {//使用window.parent调用父级jquery var head = document.getElementsByTagName("head").item(0); var linkList = window.parent.document.getElementsByTagName("link");//获取父窗口link标签对象列表 for (...
iframe js获取父级元素信息，设置css样式 和绑定事件
u011474272的博客
09-14 2170
获取iframe 父级id 为objid的内容。 $('#objid',window.parent.document).val(""); 初始化为iframe 父级 id为cancel1绑定事件 $('#cancel1',window.parent.document).bind('click', function(){ }); 设置iframe 父级class为.cover-pa
iframe样式继承父页
baidu_41875295的博客
06-05 4661
iframe页面加入如下js代码&lt;script type="text/javascript"&gt; window.onload = function() { var linkList = window.parent.document.getElementsByTagName("link"); //获取父窗口link标签对象列表 var head = document.getEle...
adminLte-iframe:adminLte整合iframe多页面显示
05-04
在侧边栏中，可以设置链接，这些链接对应着不同的iframe页面。当用户点击链接时，对应的iframe内容会被动态更新，展示新的页面。这样，用户就可以在一个统一的界面下管理和操作多个功能模块。 在adminLte-iframe-...
iframe中页面显示不全1
08-08
为解决此问题，可以尝试使用JavaScript或jQuery动态获取嵌入页面的实际高度，并据此调整`<iframe>`的高度。 此外，跨域问题也可能导致iframe内容无法正常显示。由于同源策略的限制，`<iframe>`只能加载与包含它的...
HTML中使用iframe嵌入其他界面，增加页面的灵活性、可嵌入性.zip
10-25
此外，可以通过CSS来调整iframe的样式，如`margin`、`padding`、`border-radius`等。 ### 5. 跨域问题 由于同源策略的限制，一个网页中的JavaScript无法直接操作不同源的iframe内容。若需交互，需使用`postMessage`...
利用JS从父页面给IFRAME的子页面调用CSS样式文件。
weixin_30297281的博客
09-16 963
Code<html><head><linkhref="main.css"rel="stylesheet"type="text/css"><script>functionaaa(){left.document.getElementsByTagName("link")[0].href="top.css";}</script&gt...
vue 项目中关于iframe页面缓存问题
weixin_45514326的博客
05-20 5803
1.简介 关于ifarem标签一般用于项目内外嵌页面。比如vue中经常会遇到外嵌页面的问题，但是有需求这样的 要求外嵌页面的内容保持缓存 项目中一不小心点他其它页面 再次切换回来 防止页面外嵌页面再次刷新。 2关于使用keep-alive缓存不了iframe界面原因 很多人第一想法就是会使用 keep-alive 去实现组件缓存，但是对iframe标签是行不通的，keepalive作为缓存组件这里不过多介绍，大多用于项目中 标签的嵌套 实现出口视图页面的缓存。项目中可以发现keepalive包裹
iframe继承父窗口样式CSS的方法
最新发布
企业级技术与网站app运营
04-07 862
这段JS应该可以实现，外联样式同步。在子页面的head之间添加。
iframe子页面操作父页面
m0_62089210的博客
11-09 1621
测试弹出层日志查看二级菜单主页
子页面与父页面共用js与css,JS实现iframe中子父页面跨域通讯的方法分析
weixin_35817272的博客
08-03 699
目录本文实例讲述了JS实现iframe中子父页面跨域通讯的方法。分享给大家供大家参考，具体如下：在非跨域的情况下，iframe中的子父页面可以很方便的通讯，但是在跨域的情况下，只能通过window.postMessage()方法来向其他页面发送信息，其他页面要通过window.addEventListener()监听事件来接收信息；#跨域发送信息#window.postMessage()语法oth...
使用JavaScript提取网页资源：js、css、Flash和音乐
"这篇文档是关于如何使用JavaScript从网页中获取包括JS、CSS、Flash在内的各种文件的技术介绍。作者马健提供了详细的步骤和方法，旨在帮助读者理解JavaScript在这一过程中的应用，同时也强调了这些技术的限制和适用...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

前端小歌谣

放弃很容易 但是坚持一定很酷

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值