在网页中使用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 相关文章推荐
HTTP状态代码以及定义(解释)
Feb 02 Javascript
JavaScript CSS修改学习第六章 拖拽
Feb 19 Javascript
js中if语句的几种优化代码写法
Mar 12 Javascript
学习javascript,实现插入排序实现代码
Jul 31 Javascript
JQuery仿小米手机抢购页面倒计时效果
Dec 16 Javascript
Javascript的无new构建实例详解
May 15 Javascript
实现JavaScript的组成----BOM和DOM详解
May 18 Javascript
js的三种继承方式详解
Jan 21 Javascript
超详细动手搭建一个VuePress 站点及开启PWA与自动部署的方法
Jan 27 Javascript
详解vue中的父子传值双向绑定及数据更新问题
Jun 13 Javascript
茶余饭后聊聊Vue3.0响应式数据那些事儿
Oct 30 Javascript
JavaScript面向对象核心知识与概念归纳整理
May 09 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中使用Imagick实现图像直方图的实现代码
2011/08/30 PHP
PHP中使用BigMap实例
2015/03/30 PHP
PHP的Yii框架中创建视图和渲染视图的方法详解
2016/03/29 PHP
JavaScript实际应用:innerHTMl和确认提示的使用
2006/06/22 Javascript
JavaScript游戏之是男人就下100层代码打包
2010/11/08 Javascript
js修改table中Td的值(定义td的单击事件)
2013/01/10 Javascript
自己用jQuery写了一个图片的马赛克消失效果
2014/05/04 Javascript
HTML页面弹出居中可拖拽的自定义窗口层
2014/05/07 Javascript
javascript操作ul中li的方法
2015/05/14 Javascript
js实现获取div坐标的方法
2015/11/16 Javascript
javascript html实现网页版日历代码
2016/03/08 Javascript
基于javascript制作经典传统的拼图游戏
2016/03/22 Javascript
详解jquery validate实现表单验证 (正则表达式)
2017/01/18 Javascript
基于vue2.0+vuex的日期选择组件功能实现
2017/03/13 Javascript
Vue.js实战之Vuex的入门教程
2017/04/01 Javascript
Vue.js实例方法之生命周期详解
2017/07/03 Javascript
javascript回调函数详解
2018/02/06 Javascript
JS实现运动缓冲效果的封装函数示例
2018/02/18 Javascript
Bootstrap实现可折叠分组侧边导航菜单
2018/03/07 Javascript
element-ui表格数据转换的示例代码
2018/08/24 Javascript
vue页面引入three.js实现3d动画场景操作
2020/08/10 Javascript
深入分析在Python模块顶层运行的代码引起的一个Bug
2014/07/04 Python
pycharm安装图文教程
2017/05/02 Python
详解 Python 与文件对象共事的实例
2017/09/11 Python
Python使用zip合并相邻列表项的方法示例
2018/03/17 Python
python3+PyQt5实现自定义分数滑块部件
2018/04/24 Python
python函数修饰符@的使用方法解析
2019/09/02 Python
python os.listdir()乱码解决方案
2021/01/31 Python
webView加载html图片遇到的问题解决
2019/10/08 HTML / CSS
html5跳转小程序wx-open-launch-weapp踩坑
2020/12/02 HTML / CSS
施工材料员岗位职责
2014/02/12 职场文书
手机银行营销方案
2014/03/14 职场文书
放飞梦想演讲稿
2014/05/05 职场文书
党员批评与自我批评发言
2014/10/02 职场文书
办公室班子四风问题对照检查材料
2014/10/04 职场文书
PHP基本语法
2021/03/31 PHP