编程 Javascript

设置iframe的document.designMode后仅Firefox中其body.innerHTML为br

Posted in Javascript onFebruary 27, 2012

重现如下：

<!doctype html> 
<html> 
<head> 
<title>设置iframe的document.designMode后仅Firefox中其body.innerHTML为br</title> 
<meta charset="utf-8"> 
</head> 
<body> 
<iframe frameborder="1" style="height: 330px;"></iframe> 
<script> 
var ifr = document.getElementsByTagName('iframe')[0]; 
var doc = ifr.contentWindow.document; 
function prif() { 
console.log(ifr.contentWindow.document.body.innerHTML); 
} 
function changeDesignMode() { 
ifr.contentWindow.document.designMode = 'On'; 
} 
prif(); 
</script> 
</body> 
</html>

以上代码iframe的body中没有写入任何html标记。正常情况下输出ifr.contentWindow.document.body.innerHTML应该是空字符串。但Firefox中有点特殊。
请按下面步骤依次操作。
Firefox中打开该html默认输出了空字符串
设置iframe的document.designMode后仅Firefox中其body.innerHTML为br

控制台中执行changeDesignMode方法，再执行prif方法，这时输出的innerHTML为“<br>”，如下
设置iframe的document.designMode后仅Firefox中其body.innerHTML为br

Chrome/Safari/Opera输出的仍然是空字符串。

设置iframe的document.designMode后仅Firefox中其body.innerHTML为br

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

js可突破windows弹退效果代码

Aug 09 Javascript

js控制容器隐藏出现防止样式变化的两种方法

Apr 25 Javascript

JavaScript实现的购物车效果可以运用在好多地方

May 09 Javascript

浏览器窗口大小变化时使用resize事件对框架不起作用的解决方法

May 11 Javascript

JavaScript设计模式之工厂方法模式介绍

Dec 28 Javascript

JS实现Fisheye效果动感放大菜单代码

Oct 21 Javascript

jquery捕捉回车键及获取checkbox值与异步请求的方法

Dec 24 Javascript

JSONP和批量操作功能的实现方法

Aug 21 Javascript

本地存储localStorage用法详解

Jul 31 Javascript

jQuery实现的文字逐行向上间歇滚动效果示例

Sep 06 jQuery

vue基于element的区间选择组件

Sep 07 Javascript

JS实现可用滑块滑动的缓动图代码

Sep 01 Javascript

jQuery学习笔记之控制页面实现代码

Feb 27 #Javascript

JQuery获取浏览器窗口内容部分高度的代码

Feb 24 #Javascript

JQuery操作表格(隔行着色,高亮显示,筛选数据)

Feb 23 #Javascript

基于JQuery实现鼠标点击文本框显示隐藏提示文本

Feb 23 #Javascript

js前台判断开始时间是否小于结束时间

Feb 23 #Javascript

Javascript绝句欣赏一些经典的js代码

Feb 22 #Javascript

JavaScript插入动态样式实现代码

Feb 22 #Javascript

You might like

递归列出所有文件和目录

2006/10/09 PHP

php 操作调试的方法

2012/07/12 PHP

php二维数组合并及去重复的方法

2015/03/04 PHP

Zend Framework入门之环境配置及第一个Hello World示例(附demo源码下载)

2016/03/21 PHP

php 文件下载出现下载文件内容乱码损坏的解决方法(推荐)

2016/11/16 PHP

浅谈PHP中的错误处理和异常处理

2017/02/04 PHP

PHP实现微信提现功能

2018/09/30 PHP

JavaScript高级程序设计阅读笔记（四） ECMAScript中的类型转换

2012/02/27 Javascript

JS中Iframe之间传值的方法

2013/03/11 Javascript

js 调用父窗口的具体实现代码

2013/07/15 Javascript

javascript里绝对用的上的字符分割函数总结

2014/07/31 Javascript

JavaScript Math.ceil 方法(对数值向上取整)

2015/01/09 Javascript

使用jQuery获得内容以及内容的属性

2015/02/26 Javascript

js实现文本框只允许输入数字并限制数字大小的方法

2015/08/19 Javascript

JQuery中Ajax()的data参数类型实例分析

2015/12/15 Javascript

轻松掌握JavaScript享元模式

2016/08/27 Javascript

关于List.ToArray()方法的效率测试

2016/09/30 Javascript

微信小程序 wxapp地图 map详解

2016/10/31 Javascript

jQuery模拟窗口抖动效果

2017/03/15 Javascript

vue-cli入门之项目结构分析

2017/04/20 Javascript

详解在React中跨组件分发状态的三种方法

2018/08/09 Javascript

解决layui动态加载复选框无法选中的问题

2019/09/20 Javascript

基于node+websocket+html实现腾讯课堂聊天室聊天功能

2020/03/04 Javascript

讲解Python中for循环下的索引变量的作用域

2015/04/15 Python

pytorch 自定义卷积核进行卷积操作方式

2019/12/30 Python

Python pip使用超时问题解决方案

2020/08/03 Python

python中@contextmanager实例用法

2021/02/07 Python

Django如何重置migration的几种情景

2021/02/24 Python

CSS3 制作绽放的莲花采用效果叠加实现

2013/01/31 HTML / CSS

HTML5中div、article、section的区别及使用介绍

2013/08/14 HTML / CSS

Raffaello Network西班牙：意大利拉斐尔时尚购物网

2019/03/12 全球购物

凯蒂·佩里个人女鞋品牌：Katy Perry Collections

2019/04/04 全球购物

《小池塘》教学反思

2014/02/28 职场文书

学校食品安全实施方案

2014/06/14 职场文书

党员批评与自我批评材料

2014/10/14 职场文书

Java 中的 Unsafe 魔法类的作用大全

2021/06/26 Java/Android