jQuery 是一个 JavaScript 库。jQuery 极大地简化了 JavaScript 编程。
(文档工具jQuery API 中文文档 | jQuery API 中文在线手册 | jquery api 下载 | jquery api chm)
有两个版本的 jQuery 可供下载:
- Production version - 用于实际的网站中,已被精简和压缩。
- Development version - 用于测试和开发(未压缩,是可读的代码)
- Download jQuery | jQuery
CDN在线使用
<script src="https://lib.baomitu.com/jquery/3.6.0/jquery.js"></script>
公式: $(selector).action()
美元符号定义 jQuery
选择符(selector)"查询"和"查找" HTML 元素
jQuery 的 action() 执行对元素的操作
1、选择器
按
tag
查找
var ps = $('p');
// 返回所有<p>节点
ps.length;
// 数一数页面有多少个<p>节点
按
ID
查找
// 查找<div id="abc">:
var div = $('#abc');
按class查找
var a = $('.red');
// 所有节点包含`class="red"`都将返回
// 例如:
// <div class="red">...</div>
// <p class="green red">...</p> 1234
。。。。。还有很多选择器,请看参考文档
2、事件
<!--随时显示鼠标的位置-->
mouse:<span id = "mousemove"></span>
<script>
// $(document).read(function () {
// ........页面加载,可省略
// })
$(function () {
$(document).mousemove(function (e) {
$("#mousemove").text("x:"+e.pageX+"y:"+e.pageY)
})
})
</script>
<ul id = "list">
<li id="username">张三</li>
<li id="age">12</li>
</ul>
<script>
$("#list li[id = 'age']").text("10")
</script>
后面学点ajax就是一个公式: $(selector).action()中的action