jq的使用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="jquey.min.js"></script>
<style>
div {
width: 200px;
height: 200px;
background-color: red;
}
</style>
</head>
<body>
<div></div>
<script>
$(‘div‘).hide();
</script>
</body>
</html>jq的入口函数
$(function (){
...//此处是页面DOM加载完成的入口
});$(document).ready(function(){
...//此处是页面DOM加载完成的入口
});jQuery的顶级对象$
$是jQuery的昵称，在代码中可以使用jQuery代替$，但一般为了方便，通常直接使用$。
jq与DOM的转换
1.DOM对象转换为jq对象
$(‘div‘)2.jq转换为DOM对象（两种方法）
$(‘div‘)[index] //index是索引号$(‘div‘).get(index) //index是索引号基本选择器
$("选择器") //里面选择器直接写css选择器即可，但是要加引号| 名称 | 用法 | 描述 |
| ID选择器 | $("#id") | 获取指定ID的元素 |
| 全选选择器 | $(‘*’) | 匹配所有元素 |
| 类选择器 | $(".class") | 获取同一类class的元素 |
| 标签选择器 | $("div") | 获取同一类标签的所有元素 |
| 并集选择器 | $("div,p,l") | 选取多个元素 |
| 交集选择器 | $("li.current") | 交集元素 |
层级选择器
| 名称 | 用法 | 描述 |
| 子代选择器 | $("ul>li"); | 使用>号，获取亲儿子层级的元素；注意，并不会获取孙子层级的元素 |
| 后代选择器 | $("ul li"); | 使用空格，代表后代选择器，获取ul下的所有li元素，包括孙子等 |
设置样式
$(‘div‘).css(‘属性‘,‘值‘)筛选选择器
| 语法 | 用法 | 描述 |
| :first | $(‘li:first‘) | 获取第一个li元素 |
| :last | $(‘li:last‘) | 获取最后一个li元素 |
| :eq(index) | $("li:eq(2)") | 获取到的li元素中，选择索引号为2的元素，索引号index从0开始 |
| :odd | $("li:odd") | 获取到的li元素中，选择索引号为奇数的元素 |
| :even | $(“li:even”) | 获取到li元素中，选择索引号为偶数的元素 |
筛选方法
来源：35分类目录
原文地址：https://www.cnblogs.com/1994july/p/12384514.html
时间： 2024-10-10 22:56:38