Chrome以奇怪的顺序显示dom元素,然后在刷新时修复

时间:2013-11-19 22:29:45

标签: html google-chrome

这一定是内容问题,但到目前为止我还没有找到它 - 它是新的,它刚刚开始在生产网站上发生。 使用Chrome版本31.0.1650.57 m,我可以定期复制它,到目前为止,不在任何其他浏览器中。 问题是在加载时,一些dom元素出现乱序。也就是说,dom有div1,div2,table1,div3,table2等,但渲染的网页显示div1上方的表2。据我所知,没有任何css导致它奇怪地定位,只需刷新页面就可以正确渲染。控制台中没有错误。 一个警告 - html是软件和开发人员集团的输出,并不是最好的dom结构。但同样,它在所有其他浏览器中都很好(到目前为止),直到最近才在Chrome中使用。 下面是两个截图* - 源和渲染输出。请注意,在源代码中,带有“您购物车中的商品”字样的H3标签出现在突出显示的元素(包含结帐按钮的表格)上方。但是在渲染的html中,你可以看到按钮位于H3之上。同样,如果我刷新页面,它会修复自己。

我仍在对此进行故障排除,会不断尝试找到问题,但希望有人知道可能会发生什么。我怀疑这是与顶部的图像旋转木马相关,但是现在已经使用了很长时间,所以不确定发生了什么变化。

您也可以(可能)自己重现这一点。到www.storkie.com,并在您的购物车中添加一些东西。不,我不是想引诱你去那里购物 - 只是如何解决这个问题。无论如何,它可能会在第一次添加时变得很好,但是,如果你点击顶部的查看购物车链接,它可能会出现在图片中。

提前感谢任何建议!

2 个答案:

答案 0 :(得分:0)

只是想说我有完全相同的问题。最近六个月前更新过的网站最近开始在Chrome中无序渲染元素。

对我而言,我访问该页面的时间有3次,就好像渲染在点击特定标签时重新启动一样。

我的代码看起来像这样:

<a href="javascript:__doPostBack..." class="HistoryLink">List</a>
<span class="HistoryLink_Separator">&nbsp;»&nbsp;</span>
<span class="HistoryLink_Last>Item</span>

Chrome将页面呈现为正常,直到它使用»(右双角度引号)到达SPAN,然后它再次开始在页面顶部定位元素。

答案 1 :(得分:0)

我在JSF Primefaces应用程序上遇到同样的问题,我找不到任何未转义的字符。

我的页面上的元素顺序每三次或第四次重新加载都会改变,但是我每15秒进行一次ajax轮询(刷新),当这个页面正确地渲染时会显示。

我比较了这个ajax刷新之前和之后的源代码,但是没有差异。

我知道这不是解决方案,但也许有助于接近一个。

编辑:

我在铬问题跟踪器中发现了有关此问题的问题。

https://code.google.com/p/chromium/issues/detail?id=322936&q=order&colspec=ID%20Pri%20M%20Iteration%20ReleaseBlock%20Cr%20Status%20Owner%20Summary%20OS%20Modified

无论如何,问题应该在下一个chrome版本中修复。