javascript - 混合 window.onload 和 jQuery $(function(){})

Question

可以混合 window.onload 和 $(function(){}); jQuery 在同一个脚本中？

    <script type="text/javascript">
        this.onload = function () {
            // do something
        }

        $(function () {
            //do something
        });
    </script>

Answer 1

这将起作用，因为$(function () { // ... })它是的缩写形式，$(document).ready()并且此事件在DOM解析/准备好后立即window.onload触发，但在加载所有资源（包括所有图像）后触发，因此$(function () { // ... })首先会触发一次，然后onload事件将再次触发。

$(function () {
    console.log('reday event'); // this will fire at first
});

this.onload = function () {
    console.log('load event'); // this/second will fire after "ready" event
}

另外，请记住，window.onload相当于jQuery's load事件，即$( window ).load(function() { // ... }).

检查这个例子，（两个事件一个接一个地触发，ready然后onload）。

Answer 2

您指的window.onload = function () { };是加载完所有图像后将触发哪个等。

$(function () { });or$(document).ready(function () { });在成功创建 DOM 后触发，因此，当您确定可以选择任何/特定元素时。

Answer 3

完全可以接受您的要求：

// check when DOM is ready
$(function(){
    // place code here 
    console.log('DOM ready');
});

// check when all images, links and assets have been loaded
window.load = function(){
      // place code here 
      console.log('window loaded');
};

您也可以这样做以确保在检查加载事件之前 DOM 已准备好

// check when DOM is ready
$(function(){       
      // check when all images, links and assets have been loaded
      $(window).on('load',function(){
           // place code here 
           console.log('window loaded');
      });
      console.log('DOM ready');
});

或使用本机 javascript 进行 window.load 事件

// check when DOM is ready
$(function(){
      // check when all images, links and assets have been loaded
      window.load = function(){
          // place code here 
          console.log('window loaded');
      };
      console.log('DOM ready');
});

甚至 JQuery API 文档 ready() 都说没问题：http: //api.jquery.com/ready/

您可以这样做以确保在检查 window.load 事件之前 DOM 已准备就绪。可以放在外面是的，但有时会因为不同的浏览器不一致，和其他脚本加载进去。

window.load 事件进入 ready 函数内部是完全可以接受的，以保证 window.load 事件在 DOM 准备好之后触发，而不是之前。

由于 jQuery 就绪函数，在某些情况下，有时会在所有图像加载之前触发。在 ready() 事件中，如果所有图像、链接等都已加载，则一旦运行就绪处理程序，window.load 事件将立即触发。

Answer 4

我不确定你为什么会像他们一样做基本相同的事情，所以应该没有问题。