当前位置：首页 > jquery

jquery初始化

2026-02-03 11:11:24jquery

jQuery 初始化的基本方法

在 HTML 文档中引入 jQuery 库后，通常需要通过代码初始化 jQuery 以确保 DOM 完全加载后再执行脚本。以下是常见的初始化方法：

使用 $(document).ready()

$(document).ready(function() {
    // 在这里编写 jQuery 代码
    console.log("DOM 已加载完成");
});

简写形式

$(function() {
    // 简化的初始化方式
    console.log("DOM 已加载完成");
});

动态加载 jQuery 的初始化

如果 jQuery 是通过动态脚本加载的，需确保加载完成后再初始化：

function loadjQuery() {
    var script = document.createElement('script');
    script.src = 'https://code.jquery.com/jquery-3.6.0.min.js';
    script.onload = function() {
        $(function() {
            console.log("jQuery 加载完成且 DOM 就绪");
        });
    };
    document.head.appendChild(script);
}
loadjQuery();

兼容无冲突模式

当与其他库（如 Prototype）共用时，需使用 noConflict() 避免变量冲突：

var $j = jQuery.noConflict();
$j(document).ready(function() {
    $j("#element").hide();
});

注意事项

初始化代码应放在 </body> 标签前或通过 ready 事件延迟执行。
检查 jQuery 版本兼容性，例如 1.x 支持旧版 IE，3.x 仅支持现代浏览器。
使用 CDN 时建议添加回退方案：

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>window.jQuery || document.write('<script src="local/jquery.min.js"><\/script>')</script>

jquery初始化