jQuery 中的 $(document).ready() 简写方法

在使用 jQuery 的开发中，我们经常需要在页面加载完成后执行一些操作。为此，jQuery 提供了一个方便的方法 $(document).ready()。这个方法保证了 DOM 树已经完全加载完毕，并且可以使用 jQuery 选择器选中页面中的元素。然而，在实际开发中，$(document).ready() 方法的书写显得有些繁琐。

于是，jQuery 为我们提供了一个更加简便的语法，即 $(function() {...})。这个语法等价于 $(document).ready(function() {...})，可以大大简化我们的代码量。

// 使用 $(document).ready() 方法
$(document).ready(function() {
  // 在 DOM 加载完毕后执行的代码
});

// 使用简写语法
$(function() {
  // 在 DOM 加载完毕后执行的代码
});

需要注意的是，这两种写法实现的本质是一样的。如果我们在一个页面中需要设置多个 $(document).ready() 的回调函数，那么建议我们分别写出来，而不是使用 $(function() {...}) 的简写语法。

另外，$(function() {...}) 等价于 $(window).on('load', function() {...})，也就是说，这个语法在页面中所有资源（包括图片、样式表等）都加载完成后才会执行。因此，如果我们希望页面 DOM 加载完毕后立即执行某些代码，应该使用 $(document).ready() 方法。

总之，$(function() {...}) 是一个非常简洁实用的语法，可以减少我们的代码量，提高开发效率。但是需要注意写法和适用场景，以免产生意外的问题。