背景 因为历史原因,之前很多的系统都会是 顶级页面+Iframe来加载子级页面的这种模式构件系统,而且系统都只能运行在IE6或者IE 高版本兼容模式下(IE 7模式). 随着现在的审美原来越高,脚本能里越来越强,无论是用户和是软件商都希望能系统升级,那么在升级的过程中,肯定是要保证原有的系统能正常运行的. 通常的做法会是如下: 将页面利用 html meta标签,设置Compatible属性,来使得无论用户是否设置了兼容模式,都让当前网页强势使用最高版本浏览器模式,这样可以让我们界面利用一些cs…
<iframe src="iframe16.html" id="iframe16" name="iframe16"></iframe> document.frames只有IE.Opera浏览器支持,等同于window.frames,用来获取window对象的集合.而在Firefox.Chrome.Safari浏览器中使用document.frames不能获取到Frame元素. 解决:用window.frames[]代替do…
<!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>客户详情</title> <script src=&quo…
用JS或jquery访问页面内的iframe,兼容IE/FF 注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下. index.html 文件内含有一个iframe: XML/HTML代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htm…
项目中通过iframe内嵌了一个子页面,子页面定义了一些全局变量,父页面需要获取子页面的全局变量,做了一些测试(我的环境IE10和Firefox32.0.3),得出如下结论: IE下: window.frames['iPage'].变量名  火狐下:window.frames['iPage'].contentWindow.变量名  IE&火狐下:document.getElementById('iPage').contentWindow.变量名 具体原因没有深究,今天在调试一个iframe例子的…
Js动态获取iframe子页面的高度   Js动态获取iframe子页面的高度总结 问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 给元素设置高度 这方法是用在父级页面里的,通过获取子级页面的高度给iframe设置高度 涉及了一些兼容问题: IE用attachEvent | 3C用onload来判断子页面是否加载完成. IE用contentWindow | 3C用contentDocument来获取子页面 IE用documen…
前言: 首先说一说我昨天天的苦逼经历.中午吃饭时一同事跟我说,他做的项目嵌套iframe后,子页面的position设置fixed失效了. 经过反复询问,得知他用了两层iframe,再加上最外的父页面,一共就是三层. 下午就其iframe子页面固定定位问题进行处理,上网找了各种解决方案:插件.js模拟等效果均不理想.页面不是代码过多就是效果卡顿.跳动(附:博主的同事架构的页面是用于手机微信端,部分PC端的优秀代码并不适用,非代码不行).无奈之下只得另想出路,最终功能完美实现,现拿出来与大家共享.…
iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head> <script type="text/javascript"> function say(){ alert("parent.html"); } function callChild(){ myFrame.window.say(); myFrame.w…
Vue组件下嵌套了一个不同域下的子页面,iframe子页面不能直接获取到父页面的数据,即使数据存在localStorage中,子页面一样是获取不到的,所以只好使用postMessage传数据: <iframe src="http://127.0.0.1:8888/index.html" class="mapFrame" ref="mapFrame"></iframe> 父页面发送数据参数: <script> e…
iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head> <script type="text/javascript"> function say(){ alert("parent.html"); } function callChild(){ myFrame.window.say(); myFrame.w…