在网页中使用document.write时遭遇的奇怪问题


Posted in Javascript onAugust 24, 2010

在前些日子的对Razor模板引擎向JavaScript移植进行研究的过程中,我发现如果使用document.write输出的内容中包含了调用外部的JavaScript的<script>标记,就可能出现一点问题——在这里面被调用的外部JavaScript可能会在不适当的时间被执行,对于IE和Opera来说,就是当write的参数中的所有其它部分内容都被解析之后,这些外部的JavaScript才会执行。

而在进一步研究中我又发现,对于Chrome和Safari这两个使用了WebKit网页排版引擎的浏览器来说,如果外部调用的JavaScript中再次调用document.write来写入另一个调用外部JavaScript的<script>标记,则第二次调用的外部JavaScript不会被执行,而之后的一些内容也会被打乱——实际情况其实要稍微复杂一点,跟第二级、第三级document.write调用的参数中的具体内容有关,因为时间和精力的关系我没有办法作更具体的测试了。

在经过这些研究以后,几大主流浏览器中唯一幸存的、能正确处理所有document.write调用的,就只有Firefox了。
Firefox的一种伪“多线程”事件处理的特性一直是让我很不见待的东西,这件事也算是对“各有所长”的一个佐证吧。

想要了解这个问题所引发的种种现象,可以下载write-test.zip,解压之后用各种浏览器打开其中的write-test.htm。

这几天我一直在尝试编写一个替用函数来解决这个问题,目前已经能顺利通过上面那个链接中的测试了。
如果接下来的几天之内没有发现什么明显的问题,我会把它发在博客上供大家参考。
测试代码,打包下载

Javascript 相关文章推荐
Js(JavaScript)中,弹出是或否的选择框示例(confirm用法的实例分析)
Jul 09 Javascript
JS限制Textarea文本域字符个数的具体实现
Aug 02 Javascript
javascript full screen 全屏显示页面元素的方法
Sep 27 Javascript
javascript的propertyIsEnumerable()方法使用介绍
Apr 09 Javascript
JavaScript实现防止网页被嵌入Frame框架的代码分享
Dec 29 Javascript
jQuery Mobile弹出窗、弹出层知识汇总
Jan 05 Javascript
js enter键激发事件实例代码
Aug 17 Javascript
js 动态生成json对象、时时更新json对象的方法
Dec 02 Javascript
BootStrap学习笔记之nav导航栏和面包屑导航
Jan 03 Javascript
Vue内容分发slot(全面解析)
Aug 19 Javascript
vuejs中监听窗口关闭和窗口刷新事件的方法
Sep 21 Javascript
NProgress显示顶部进度条效果及使用详解
Sep 21 Javascript
javascript下string.format函数补充
Aug 24 #Javascript
javascript下利用arguments实现string.format函数
Aug 24 #Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件
Aug 24 #Javascript
js null,undefined,字符串小结
Aug 21 #Javascript
javascript中的float运算精度实例分析
Aug 21 #Javascript
Firebug入门指南(Firefox浏览器)
Aug 21 #Javascript
jquery插件之easing 动态菜单
Aug 21 #Javascript
You might like
yii2中关于加密解密的那些事儿
2018/06/12 PHP
JQuery 无废话系列教程(一) jquery入门 [推荐]
2009/06/23 Javascript
基于jQuery的模仿新浪微博时间的组件
2011/10/04 Javascript
简略说明Javascript中的= =(等于)与= = =(全等于)区别
2013/04/16 Javascript
javascript间隔定时器(延时定时器)学习 间隔调用和延时调用
2014/01/13 Javascript
在JavaScript中重写jQuery对象的方法实例教程
2014/08/25 Javascript
CSS3,HTML5和jQuery搜索框集锦
2014/12/02 Javascript
JS中改变this指向的方法(call和apply、bind)
2016/03/26 Javascript
JavaScript制作简单分页插件
2016/09/11 Javascript
详解在WebStorm中添加Vue.js单文件组件的高亮及语法支持
2017/10/21 Javascript
vue中element组件样式修改无效的解决方法
2018/02/03 Javascript
vue项目中mock.js的使用及基本用法
2019/05/22 Javascript
jquery传参及获取方式(两种方式)
2020/02/13 jQuery
vue 限制input只能输入正数的操作
2020/08/05 Javascript
python发腾讯微博代码分享
2014/01/10 Python
在Python的web框架中配置app的教程
2015/04/30 Python
Python+PIL实现支付宝AR红包
2018/02/09 Python
Flask之flask-script模块使用
2018/07/26 Python
python 美化输出信息的实例
2018/10/15 Python
python 对给定可迭代集合统计出现频率,并排序的方法
2018/10/18 Python
python对csv文件追加写入列的方法
2019/08/01 Python
python系统指定文件的查找只输出目录下所有文件及文件夹
2020/01/19 Python
Django nginx配置实现过程详解
2020/09/10 Python
python中如何打包用户自定义模块
2020/09/23 Python
Python通过Schema实现数据验证方式
2020/11/12 Python
Python 利用argparse模块实现脚本命令行参数解析
2020/12/28 Python
利用CSS3实现的文字定时向上滚动
2016/08/29 HTML / CSS
韩都衣舍天猫官方旗舰店:天猫女装销售总冠军
2017/10/10 全球购物
求网格中的黑点分布
2013/11/06 面试题
计算机应用专业推荐信
2013/11/13 职场文书
爸爸的花儿落了教学反思
2014/02/20 职场文书
派出所班子党的群众路线对照检查材料思想汇报
2014/10/01 职场文书
2015年个人思想总结
2015/03/09 职场文书
交通肇事罪辩护词
2015/05/21 职场文书
安全知识竞赛主持词
2015/06/30 职场文书
带你了解CSS基础知识,样式
2021/07/21 HTML / CSS