本教程详细介绍了在Web项目中引入jQuery库的标准方法。通过在HTML文件中使用

欢迎使用 jQuery！

点击我

这是一个段落。

登录后复制在上述示例中：

src属性指定了jQuery库文件的URL。

integrity属性提供了子资源完整性（Subresource Integrity, SRI）哈希值，用于验证从CDN加载的脚本是否被篡改，增强了安全性。

crossorigin属性用于处理CORS（跨域资源共享）请求，对于CDN资源通常设置为anonymous。

3. 本地引入jQuery

如果你更倾向于将jQuery文件托管在自己的服务器上，或者在没有网络连接的环境中开发，你可以下载jQuery库文件并本地引入。

立即学习“Java免费学习笔记（深入）”；

百度文心百中

百度大模型语义搜索体验中心

22

查看详情

步骤：

从jQuery官方网站（https://jquery.com/download/）下载最新版本的jQuery文件（通常选择压缩版.min.js）。

将下载的文件放置在你的项目目录中，例如 js/jquery-3.6.0.min.js。

示例代码：

登录后复制4. 在JavaScript文件中使用jQuery

一旦jQuery通过上述任一方式成功引入到HTML页面中，你就可以在任何关联的JavaScript文件中（例如 my-script.js）使用$或jQuery对象了。

my-script.js 示例：// 确保DOM加载完成后执行代码

$(document).ready(function() {

// 选中ID为myButton的元素，并添加点击事件监听器

$('#myButton').on('click', function() {

// 改变ID为myParagraph的元素的文本内容

$('#myParagraph').text('按钮被点击了！');

// 切换段落的可见性

$('#myParagraph').toggle();

});

// 示例：使用jQuery选择器和方法

console.log('页面加载完成！');

$('h1').css('color', 'blue'); // 将H1标题文字颜色设为蓝色

});

// 你也可以使用更简洁的语法来替代 $(document).ready()

// $(function() {

// console.log('DOM ready (简洁语法)!');

// });登录后复制5. 注意事项与最佳实践

脚本标签位置：

中： 如果将jQuery放在中，浏览器会先下载和解析jQuery，然后再渲染页面内容。这可能导致页面渲染阻塞，但确保了所有后续脚本在DOM加载前就能使用jQuery。

结束前： 将