它是确定前准备状态操作DOM？

StackOverflow https://stackoverflow.com/questions/1222849

题

这通常是我如何管理逐步加强，同时保持经验干净，但是是怎么安全的呢？是有潜力的竞争条件，这不工作？

想象的简单抽象的场景，你想，如果你有JavaScript的支持，以显示不同的东西..这通常是我最终会做：

<div id="test">original</div>
<script type="text/javascript">
    var t = document.getElementById('test');
    t.innerHTML = 'changed';
</script>

很多人可能要求你应该使用一个框架，并等待domready中的事件，并做修改有..但是有在“检验”元素将已经文档和CSS结束之前渲染的显著延迟准备和domready中触发器..因此引起的noticable闪烁“原始的”。

这是代码易于竞争条件的失败？或我可以机制保障一个元件是可发现的且可修改的，如果它的脚本之前存在？

预先感谢。

有帮助吗？

解决方案

可以，但围绕这样做的问题。

首先，在IE浏览器，如果你试图操纵尚未关闭的节点（它的关闭标记之前如BODY这应该是你的JS以下），那么你可能会遇到IE的“操作已中止”的错误，这将导致一个空白页。一个节点的操纵包括附加节点，移动节点，等等。

在其他浏览器的行为是不确定的，但是它们通常表现为你所期望的。主要的问题是，随着你的网页的发展，该页面可以加载/解析/运行不同。这可能会导致一些脚本运行一个浏览器定义中引用的元件实际上被创建并用于DOM操作可用之前。

如果您正试图提高用户感知性能（即爽）。我强烈建议你避免这条道路，并期待为减轻您的网页。您可以使用Yahoo的YSlow的/谷歌的页面的性能萤火虫帮助您开始。

谷歌的网页速度

雅虎YSlow的

其他提示

您可以操作DOM已经完全加载之前，但它是有风险的。你显然不能保证DOM的你正在试图操纵到位确实存在呢，所以你的代码可能会间歇性。

只要你仅修改它preceed脚本块节点（即节点的结束标记preceeds脚本的开始标记），则不应遇到任何问题。

如果你想确保操作成功，在try...catch块包装代码，并通过setTimeout()失败再次调用它。

在Viajeros.com我自8-9个月的负载指示器工作，我没有问题为止。它看起来像这样：

<body>

<script type="text/javascript">
    try {
        document.write('<div id="cargando"><p>Cargando...<\/p><\/div>');
        document.getElementById("cargando").style.display = "block";
    } catch(E) {};
</script>

访问DOM过早引发在IE 5和导航器4。例外

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top