jQuery的基本选择器和class操作和属性操作

jQuery的基本选择器

ID选择器

  $("#id");//获取指定ID的元素

类选择器

 $(".class");//获取同一类class的元素

标签选择器

 $("div");//获取同一类标签的所有元素

并集选择器

 $("div,p,li");//使用逗号分隔，只要符合条件之一就可。

交集选择器

    $("div.redClass");//获取class为redClass的div元素

子代选择器

    $("ul>li");//使用>号，获取儿子层级的元素，注意，并不会获取孙子层级的元素

后代选择器

    $("ul li");//使用空格，代表后代选择器，获取ul下的所有li元素，包括孙子等

:eq（index）

    $(“li:eq(2)”).css(“color”, ”red”);//获取到的li元素中，选择索引号为2的元素，索引号index从0开始。

:odd

 $(“li:odd”).css(“color”, ”red”);//获取到的li元素中，选择索引号为奇数的元素

:even

$(“li:even”).css(“color”, ”red”);//获取到的li元素中，选择索引号为偶数的元素
筛选选择器

children(selector)

$(“ul”).children(“li”)//相当于$(“ul>li”)，子类选择器

find(selector)

$(“ul”).find(“li”);//相当于$(“ul li”),后代选择器

siblings(selector)

$(“#first”).siblings(“li”);//查找兄弟节点，不包括自己本身。

parent()

$(“#first”).parent();//查找父亲

eq(index)

$(“li”).eq(2);//相当于$(“li:eq(2)”),index从0开始

next()

$(“li”).next()//找下一个兄弟

prev()

$(“li”).prev()//找上一次兄弟

//添加类

   $("li").addClass("aa");

//移出类

  $("li").removeClass("aa");

//判断类

  console.log($("li").hasClass("aa"));//返回布尔值

//切换类

 	 //需求：判断是否有aa类，有就删除aa，没有就添加aa
	 $("li").toggleClass("aa");

//设置单个属性

 $("img").attr("alt","1111");

//设置多个属性

  $("img").attr({"title":"京剧","alt":"222"});

//获取属性

 $("img").attr("title")