最近在学习jQuery，会在这里持续更新学习笔记，希望能够对陌生的你有所帮助！ 笔记会尽可能的简洁和通俗易懂，喜欢的话记得点赞喔 ~
一、什么是jQuery？
jQuery是一个JavaScript函数库，它极大简化了JavaScript语法，让Web开发中的HTML文档遍历、事件处理、动画和Ajax交互等操作变得更加简单。它的宗旨是Write less, do more。
需要注意的是，在学习jQuery之前，你应该对HTML、 CSS、 JavaScript和Document Object Model (DOM) 的基础知识有一定的了解。
二、如何引用jQuery库？
引用jQuery有两种方法：
- 本地安装
- 基于CDN引用
1. 本地安装
首先，在Github jQuery上下载最新的jQuery版本，并解压。在这里我们选择3.3.1版本。
然后，在解压文件的dist目录下找到jquery.js文件，把它的路径放到<script>的src属性中。例如：
<html>
<head>
<title>The jQuery Example</title>
<script type = "text/javascript" src = "/jquery-3.3.1/dist/jquery.min.js"></script>
</head>
<body>
<h1>Hello</h1>
<script type = "text/javascript">
$(document).ready(function() {
document.write("Hello, World!");
});
</script>
</body>
</html>
2. 基于CDN引用
如果你不想在自己的计算机上存放 jQuery 库，那么可以从 Google 或 Microsoft 加载 CDN jQuery 核心文件。只需把<script>中的路径改为相应资源的URL即可。这些URL都可以从jQuery Download中找到。
例如：
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
</head>
三、如何调用jQuery函数？
所有的 jQuery 事件和函数都应该置于ready事件中，因为$(document).ready()定义了当 DOM（文档对象模型） 已经加载，并且页面（包括图像）已经完全呈现时，会发生 ready 事件。
语法：
$(document).ready(function() {
// jQuery 事件和函数
});
举例：
<html>
<head>
<title>The jQuery Example</title>
<script type = "text/javascript" src = "jquery-3.3.1/dist/jquery.min.js"></script>
</head>
<body>
<div id = "mydiv">
点击查看弹出框
</div>
<script type = "text/javascript">
$(document).ready(function() {
$("div").click(function() {alert("Hello, world!");});
});
</script>
</body>
</html>
网友评论