jQuery ready 执行

在使用 jQuery 进行 web 开发时，我们经常会遇到需要在页面加载完成后执行一些 JavaScript 代码的情况。这就涉及到了 jQuery 的 ready 方法。

什么是 ready 方法

ready 方法是 jQuery 提供的一个事件处理函数，用于在文档加载完成后执行指定的代码。它的基本语法如下所示：

$(document).ready(function() {
  // 这里是需要执行的代码
});

ready 方法的内部会通过检查 document.readyState 的值来判断文档是否已经加载完成。当 document.readyState 的值为 complete 时，表示文档已经加载完成，ready 方法就会执行传入的回调函数。

使用 ready 方法的好处

使用 ready 方法可以确保我们的代码在文档加载完成后再执行，避免了在文档还未完全加载完成时就去操作 DOM，导致出现一些意想不到的错误。

另外，使用 ready 方法还可以将 JavaScript 代码放在 <head> 或 <body> 中的任何位置，而不需要担心代码执行时 DOM 元素是否已经加载完成。

示例代码

下面是一个使用 ready 方法的示例代码，通过点击按钮来改变页面上一个元素的文本内容：

<script src="
<script>
  $(document).ready(function() {
    $('#btn').click(function() {
      $('#message').text('Hello, jQuery!');
    });
  });
</script>
<body>
  Welcome
  <button id="btn">Click here</button>
</body>

在上面的代码中，我们通过 $(document).ready() 把点击按钮时改变文本内容的代码包裹起来。这样，当页面加载完成后，点击按钮就会触发 click 事件，然后执行我们的代码。

其他等价写法

除了使用 $(document).ready()，我们还可以使用 $() 或者 jQuery() 来代替，这两种写法是等价的。例如：

$(function() {
  // 这里是需要执行的代码
});

jQuery(function() {
  // 这里是需要执行的代码
});

结语

通过使用 jQuery 的 ready 方法，我们可以确保代码在文档加载完成后再执行，避免了因为 DOM 尚未加载完成而导致的错误。同时，使用 ready 方法还可以简化代码的编写，提高开发效率。希望本文对你了解 jQuery 的 ready 方法有所帮助。