CSS选择器
1.id选择器
$(".list").css("color","red");
2.class选择器
$("#idd").css("color","green");
3.标签选择器
$("li").css("color","yellow");
4.通用选择器
$("*").css("color","red");
5.层级选择器
$("div>span").html()
6.后代选择器
$("div span").html("哈哈")
7.子代选择器
$("div>span>span").html("呵呵");
8.群主选择器
$("div,p").html("我是新增的")
9.交叉选择器
$("#btn.box").css("background","pink")
10.紧邻选择器
// 条件1: 紧挨着制定目标 (这里的指定目标: .box)
// 条件2: 需要在目标的下方书写
$(".box+p").html("我是一个段落");
11.同辈选择器
$(".box~p").css("background","yellow");
12.条件:first 匹配到第一个符合条件的元素
$('li:first').css("background","yellow")
13.条件:last 匹配到最后一个符合条件的元素
$('li:last').css("background","red")
14.条件:not() 除了()中指定的条件,获取当前指定的元素,括号中可以是类名,不能写数字
$("li:not(.list)").html("我是一个Li");
15.条件:even索引为偶数的,从0开始,0为偶数
$("li:even").css("background","blue");
16.条件:odd 索引为奇数的
$("li:odd:not(.list)").css("background","pink");
17.条件:eq(指定索引值)
$("li:eq(0)").html("我是一个开头");
18.条件:gt(大于索引值)
$("li:gt(1)").html("我是被修改的");
19.条件:lt(小于索引值)
$("li:lt(5)").css("color","black");
后代选择器和find()方法
$("p span").html("我被html方法改了");
//搜索所有段落中的后代 span 元素,并将其颜色设置为红色:
$("p").find("span").css("background","red");
子元素选择器和 children() 方法
$("p>span").css("color","blue");
// 取得一个包含 匹配的元素集合中 每一个元素的所有子元素的元素集合
// 描述:查找DIV中的每个子元素。
$("p").children().css("fontSize","30px");
// 描述:在每个父级div中查找 .selected 的类名
$("div").children(".selected")
紧邻选择器和 next()方法
$(".d+button").html("点我");
$(".d").next().css("color","blue");
nextAll 方法 后面所有
$(".d").nextAll("button").html("哈哈哈");
prev 方法上一个
$(".d").prev().html("我是上一个div");
prevAll 方法上面所有
$(".d").prevAll().html("我是新来的div"); // innerHTML
$(".d").prevAll("span").text("我是新来的div"); // innerText
$(".d+button").val("大爷"); //input框的 value
siblings 方法上面下面所有同级的所有,不包括自己
$(".d").siblings("button")
parent 获取父元素
addclass
$(selector).addClass("class") //为每一个匹配的元素添加指定的类名