一.什么事jquery
jQuery 是一个快速、小巧且富有特色的 JavaScript 库，它简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。jQuery 的设计目标是“写更少的代码，做更多的事情”。
jQuery 的主要特点：
- 跨浏览器兼容性：jQuery 解决了各种浏览器的兼容性问题，开发者无需担心不同浏览器的差异。
- 简化 HTML 文档遍历：使用 jQuery，可以轻松地选择和操作 HTML 元素。
- 简化事件处理：jQuery 提供了一种简单的方法来处理用户交互，如点击、悬停等。
- 动画和特效：jQuery 提供了一系列的动画方法，使动画效果更为容易实现。
- Ajax 简化：使用 jQuery，无需编写复杂的 XMLHttpRequest 代码，就可以轻松实现异步数据交互。
- 链式操作：jQuery 支持链式操作，使代码更简洁、易读。
-
原生JavaScript（以下简称JS）在使用时确实存在一些局限性，主要可以归纳为以下几点：
- 无法添加多个入口函数（window.onload）：当需要为页面加载添加多个处理函数时，原生JS无法实现，后面的处理函数会覆盖前面的。
- API名称过长且难以记忆：原生JS的API名字通常较长，如document.getElementById()，这增加了记忆的难度。
- 代码冗余：在使用原生JS进行某些操作时，可能会产生冗余的代码，例如对多个元素进行相同的操作需要分别写出每个元素的代码。
- 浏览器兼容性问题：原生JS中的某些方法或属性在不同浏览器中可能存在兼容性问题，开发者需要花更多的时间来处理这些问题。
- 容错率低：在原生JS中，如果前面的代码出现错误，后面的代码可能无法执行，容错性较差。
总结：这些问题可能会使开发过程变得复杂和耗时。然而，通过使用一些JS库（如jQuery）可以有效地解决这些问题，提高开发效率。
二. jquery的引用
要在网页中引用jQuery库，你需要从jQuery的官网或其他可靠的源下载jQuery库文件，然后将其放置在你的网站服务器上。之后，你可以在HTML文件中使用<script>标签来引用它。
以下是一个基本的引用示例：
<!DOCTYPE html>
<html>
<head>
<title>页面标题</title>
<script src="path/to/jquery.min.js"></script>
</head>
<body>
<!-- 页面内容 -->
</body>
</html>在上面的示例中，<script src="path/to/jquery.min.js"></script>标签指定了jQuery库文件的路径。你需要将其中的path/to/替换为实际的文件路径。确保在引用jQuery之前加载其他JavaScript代码，以确保页面中的脚本按照预期的顺序执行。
检查jQuery的引用是否正确
要检查jQuery的引用是否正确，你可以按照以下步骤进行操作：
- 打开你的HTML文件，找到引用jQuery的
<script>标签。 - 检查
src属性的值是否正确指向jQuery库文件的路径。确保路径是正确的，并且文件确实存在于指定的位置。 - 在浏览器中打开HTML文件，然后打开开发者工具（通常通过按F12键或右键单击页面并选择"检查"来打开）。
- 在开发者工具中，转到"控制台"选项卡。
- 在控制台中，尝试运行一些简单的jQuery代码，例如
$(document).ready(function() { console.log("页面已加载"); });。 - 如果jQuery引用正确，控制台应该会显示"页面已加载"。如果没有显示任何内容或出现错误消息，则说明jQuery引用可能存在问题。
- 检查控制台中的错误消息，以获取更多关于问题的详细信息。
如果你仍然无法解决问题，可以尝试在浏览器中打开HTML文件时按F5键刷新页面，以确保浏览器加载最新的脚本文件。此外，确保你的HTML文件正确地引用了jQuery库文件，并且该文件在引用其他脚本之前加载。
使用jquery的简单方法
text和html的方法
jQuery对象的本质
jQuery对象的本质是dom对象的数组+jQuery提供的一系列的功能函数
实例
代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>a03_JQuery/a02_DOM对象和JQuery对象.html</title>
<script src="js/jquery-3.7.0.js"></script>
<script>
$(function(){
var arr=[12,"abc",true];
var $btns=$("button")
alert(1);
});
</script>
</head>
<body>
<button id="btn1">very Good!!</button>
<button id="btn2">使用DOM</button>
<button id="btn3">使用Jquery对象调用JQuery方法</button>
<button id="btn4">使用jQuery对象调用DOM方法</button>
</body>
</html>