2010-7-29 Updates:
如果将render解析为“呈现”,即是将元素显示到视窗中,那么Nicholas的说法在大部分浏览器下是正确的,经过下面使用PHP方式的测试,在没有将闭合标签加载下来之前,页面无法显示h1标签内容,但是IE除外,它仍然显示内容和应用样式。
同时还有一点需要说明的是:一些文章说在head和body之间插入flush()方法来尽早的输出head的内容,以至于尽快的下载样式资源,这也是有一定道理的,但是由于刷新输出的head内容是不可见的,所以页面上还是会一片空白,等待内容的呈现。所以比较合理的做法是将内容分块,或者将页面内容分为head、body、footer等俺顺序使用flush刷新输出,这样就使得有一个比较流畅的页面显示效果。
本人的blog正在这样实践着……
————————纠正分界线—————————
在Nicholas的一个PPT中看到了这句话“The browser won’t render a block-level element inside of <body>
until the closing tag has been received”,意思就是“在body中,浏览器在一个块级元素的闭合标签未加载下来之前不会渲染该元素”,第一次看到这样的说法,感到很奇妙,到底是不是真的呢?
首先,使用javasript来进行测试,在一个块级元素中嵌套一个脚本,来获取该块级元素的innerHTML,《测试用例》,测试结果上面的说法错误。
接着测块级元素的style,使用js输出块级元素的style属性值,《测试用例》,测试结果上面的说法错误。
接着使用PHP的方式,在块级元素的闭合标签前面加上<php flush(); sleep(3); ?>,来查看是否会刷新输出内容,测试结果就是文章标题中所说明的问题,使用flush()和ob_flush();flush()组合的结果是不同的,并且在不同的浏览器下行为又有所不同。《flush()》,《ob_flush();flush()》。
PHP的测试结果为:使用flush()的形式的时候,Opera、Chrome、Safari、IE并没有在flush执行的时候刷新输出前面的内容;使用ob_flush();flush()组合的时候,Opera、Chrome、Safari、IE可以刷新输出前面的内容,但是这里又有个小插曲,IE可以输出元素闭合标签之前的内容,并可以渲染样式,但是Opera、Chrome、Safari只输出该元素之前的内容,该元素内的文本内容不会刷新输出。或许大家没有看到我提及Firefox浏览器的情况,经过测试,Firefox杯具的是两种形式都不会刷新输出内容,需要等到整个HTML文档加载完成才显示页面。为此,应该避免下面的情况:
<div>Hello baby,www.ilovejs.net is here...<?php ob_flush();flush(); ?></div> <!--或者--> <div>Hello baby,www.ilovejs.net is here...<?php flush(); ?></div>
经过这些测试,可以得到明显的结论:在输出刷新方面,尽量使用ob_flush();flush()组合,并且避免在HTML标签的闭合标签之前刷新输出。