document.ready - JavaScript

document.ready 是一个 JavaScript 方法，当 DOM（文档对象模型）加载完成时执行其中的代码。通常用于确保在页面加载完毕后再执行 JavaScript 代码。

使用方法

$(document).ready(function() {
   // 在此处编写需要在页面加载完成后执行的代码
});

或者使用简写形式：

$(function() {
   // 在此处编写需要在页面加载完成后执行的代码
});

为什么要使用 document.ready

在 HTML 页面中，JavaScript 代码通常会直接放在 <script> 标签中。当浏览器解析到 <script> 标签时，会立即执行其中的代码。如果 JavaScript 代码依赖于 DOM 元素，可能会出现问题，因为在解析到 <script> 标签时，DOM 元素可能尚未加载完成。

使用 document.ready 可以确保在执行 JavaScript 代码之前，DOM 已经加载完毕，从而避免出现这样的问题。

示例

以下是一个使用 document.ready 的示例，用于在页面加载完成后显示一个欢迎消息：

$(document).ready(function() {
   var message = "欢迎访问我们的网站！";
   alert(message);
});

当页面加载完成后，将显示一个弹窗包含欢迎消息。

注意事项

• document.ready 方法仅在页面加载完成后执行一次，如果需要在特定事件触发时执行代码，应该使用其他方法，如事件监听器。
• 在使用 document.ready 之前，确保引入了 jQuery 库，因为 $(document).ready 是 jQuery 提供的方法。

参考资料

• jQuery API 文档 - ready