在网页中使用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 相关文章推荐
jQuery UI Dialog控件中的表单无法正常提交的解决方法
Dec 19 Javascript
javascript文件中引用依赖的js文件的方法
Mar 17 Javascript
关于jQuery判断元素是否存在的问题示例探讨
Jul 21 Javascript
只要1K 纯JS脚本送你一朵3D红色玫瑰
Aug 09 Javascript
gulp-uglify 与gulp.watch()配合使用时报错(重复压缩问题)
Aug 24 Javascript
node.js中fs.stat与fs.fstat的区别详解
Jun 01 Javascript
无限循环轮播图之运动框架(原生JS实现)
Oct 01 Javascript
封装运动框架实战左右与上下滑动的焦点轮播图(实例)
Oct 17 Javascript
react-native使用leanclound消息推送的方法
Aug 06 Javascript
Node.js中package.json中库的版本号(~和^)
Apr 02 Javascript
vue cli使用融云实现聊天功能的实例代码
Apr 19 Javascript
小程序表单认证布局及验证详解
Jun 19 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
用PHP实现Ftp用户的在线管理的代码
2007/03/06 PHP
PHP游戏编程25个脚本代码
2011/02/08 PHP
使用gd库实现php服务端图片裁剪和生成缩略图功能分享
2013/12/25 PHP
ThinkPHP5框架缓存查询操作分析
2018/05/30 PHP
javascript 定义初始化数组函数
2009/09/07 Javascript
var与Javascript变量隐式声明
2009/09/17 Javascript
bgsound 背景音乐 的一些常用方法及特殊用法小结
2010/05/11 Javascript
JavaScript高级程序设计阅读笔记(五) ECMAScript中的运算符(一)
2012/02/27 Javascript
用Jquery重写windows.alert方法实现思路
2013/04/03 Javascript
js局部刷新页面时间具体实现
2013/07/04 Javascript
jQuery实现简单的日期输入格式化控件
2015/03/12 Javascript
BootStrap table表格插件自适应固定表头(超好用)
2016/08/24 Javascript
Centos7 中 Node.js安装简单方法
2016/11/02 Javascript
jQuery简单实现遍历单选框的方法
2017/03/06 Javascript
详解基于vue-cli优化的webpack配置
2017/11/06 Javascript
解决vue-cli单页面手机应用input点击手机端虚拟键盘弹出盖住input问题
2018/08/25 Javascript
使用 webpack 插件自动生成 vue 路由文件的方法
2019/08/20 Javascript
Vue中的this.$options.data()和this.$data用法说明
2020/07/26 Javascript
JavaScript语句错误throw、try及catch实例解析
2020/08/18 Javascript
[01:03:13]VG vs Pain 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
python在windows下实现ping操作并接收返回信息的方法
2015/03/20 Python
python Django批量导入不重复数据
2016/03/25 Python
Python 使用PIL numpy 实现拼接图片的示例
2018/05/08 Python
pygame游戏之旅 python和pygame安装教程
2018/11/20 Python
python自动化实现登录获取图片验证码功能
2019/11/20 Python
利用Pytorch实现简单的线性回归算法
2020/01/15 Python
基于python3实现倒叙字符串
2020/02/18 Python
ONLY德国官方在线商店:购买时尚女装
2017/09/21 全球购物
南京迈特望C/C++面试题
2012/07/09 面试题
师范生自荐信
2013/10/27 职场文书
助理政工师申报材料
2014/06/03 职场文书
企业宣传标语
2014/06/09 职场文书
自荐信大全
2019/03/21 职场文书
JS新手入门数组处理的实用方法汇总
2021/04/07 Javascript
Vue自定义铃声提示音组件的实现
2022/01/22 Vue.js
使用CSS实现按钮边缘跑马灯动画
2023/05/07 HTML / CSS