Question

首次加载页面时，我们可以使用window.onload确保在我们执行某些操作之前已加载所有资源。

我的问题是，如果我们修改DOM（例如根据ajax请求插入一些html），当文档再次处于“已加载”状态时是否会触发任何事件？ （例如，当插入的html包含多个图像时）。

（用jQuery解决方案没问题。）

Answer 1

答案简短： NO。

答案很长：如果你知道你在寻找什么，你可以使用变异观察者（https://developer.mozilla.org/en-US/docs/DOM/MutationObserver）。它只支持新的浏览器，并且在某些版本的chrome中，当与闭包一起使用时会出现内存泄漏。

顺便说一句， document.ready不会告诉您是否所有（或任何......）资源都已加载。它只告诉你，dom准备就绪（这是加载功能，它只会在所有资源（以及任何未使用javascript请求的资源）下载后才会启动）。

Answer 2

您可以使用.done()。

描述：添加要在解析Deferred对象时调用的处理程序。

还有jQuery插件See Here

Answer 3

我会说YES（我不知道所有浏览器是否支持这种情况。我在safari和chrome中使用它）

你可以在这里找到的测试用例：http://maakmenietgek.nl/testcases/domready/请注意，我无法让它成为一个小提琴，这就是为什么一个独立的测试用例

index.html看起来像这样

<!DOCTYPE html>
<head>
  <title>Testcase</title>
  <script src="jquery-1.8.2.js" type="text/javascript" charset="utf-8"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      $('#clickme').click(function() {
        $.get('ajaxdata.html', function(data) {
            $('#addhere').html(data);
        });
      });
    })
  </script>
</head>
<body>
  <p id="clickme">clickme</p>
  <div id="addhere">
  </div>
</body>
</html>

$.get调用加载的数据如下所示

<p>added data</p>
<script type="text/javascript">
    $(document).ready(function() {
        alert('added data');
    });
</script>

将html添加到DOM

后显示警报

修改DOM后window.onload等效？

3 个答案: