转载

DOM之document.write

document.write方法输出字符串到页面. 这个方法已经去比较古老的方法. 在现代的浏览器中比较少用了. 但是仍旧有它使用的地方.

document.write 执行

当文档加载时, 文档中一个脚本中有document.write(text). text将会同种方式渲染.

看下面的例子:

...  <script>   document.write('*Hello, there!*') </script> ...

document.write的内容是没有任何限制的. 它不需要输出有效的标签,关闭它们.

下面例子中, 每一个document.write输出文本的一小部分, 追加到页面中.

<script> document.write('<style> td { color: #F40 } </style>') </script> <table>   <tr>   <script> document.write('<td>') </script>    The sun is rising, and I'm happy to welcome it.   <script> document.write('</td>') </script>   </tr> </table>

同样有一个类似名称document.writeln(text), 这个方法追加一个 '/n' 到文本后面.

仅打开文档

There is only one restriction on document.write.document.write只有一个限制约束.

document.write和document.writeln 方法都可以输出文本到一个打开的文档.

当页面加载完成时, 文档会被关闭. 试图使用document.write到页面, 则会引起内容被删除.

XHTML 和 document.write

Mozilla使用XML模型解析任何Content-Type:application/xhtml+xml的文档

在这个模式中, 浏览器作为XML解析,快速又非常好. 但是由于技术限制性解析, document.write不会执行.

好与坏

在多数实际中, 我们倾向于使用DOM去改变更新, 因为这样方便. 或者使用innerTHML做同样的事情.

但是document.write在添加一个script生成的文本到页面是非常快速的方式.

同时, 他也使用在广告脚本和计数器上:

<script>   var url = 'http://ads.com/buyme?rand='+Math.random()   document.write('<script src="'+url+'"></scr'+'ipt>') </script>

---脚本URL动态的生成, 允许用户指定的数据添加到URL中,例如屏幕分辨率等其他的参数.

--添加一个随机数, 避免缓存相关数据

--关闭</SCRIPT>是分开的. 另外的浏览器认为脚本在</script>之前完成.

非常的方便, 但也是不好的方式, 因为加载脚本可能会影响其他页面的加载渲染. 尤其是一个广告服务器非常慢的时候.

慎重考虑插入第三方的脚本.

一个最好的避免页面阻塞的方式. 使用DOM创建SCRIPT元素, 追加它到头部.

var script = document.createElement('script') script.src = 'http://ads.com/buyme?rand='+Math.random()  // now append the script into HEAD, it will fetched and executed document.documentElement.firstChild.appendChild(script)

使用DOM不会影响其他页面的加载, 使用第三方的脚本也是快速安全的.