找标签
jQuery找标签和CSS找标签的方式有些类似
$("a,#d1") 找到a标签和id为d1的标签,相当于CSS选择器的组合选择器
$("form input") 找到form标签中的所有input标签
$("form>input") 找到包裹在form标签中的input标签
$("label+input") 找到紧挨在label标签后面的input标签
$("label~input") 找到label标签同级的input标签(兄弟标签)
jQuery对象和DOM对象的相互转换 jQuery对象保存到变量的时候,一般变量名字前面加$符号
var d1element=document.getElementById("d1") //找到id为d1的标签
var $d1element=jQuery(d1element) //DOM对象转换成jQuery对象
var d1element=$d1element[0] ////jQuery对象转换成DOM对象
筛选器
$("ul li:first") //找到ul标签下的第一个li标签
$("ul li:last") //找到ul标签下的最后一个li标签
$("ul li:eq(3)") //找到ul标签下索引为3的li标签
$("ul li:even") //找到ul标签下索引为奇数的li标签
$("ul li:odd") //找到ul标签下索引为偶数的li标签
$("ul li:gt(3)") //找到ul标签下索引大于3的li标签
$("ul li:lt(3)") //找到ul标签下索引小于3的li标签
$("#d2 p:not(.c2)") //在id为d2的标签内找到所有不含c2属性的p标签
$("#d2 p:has(a)") //在id为d2的标签内找到所有包含a标签的p标签
$("#d1").prev() //id为d1标签的上一个标签
$("#d1").prevAll() //id为d1标签的上面所有标签
$("#d1").prevUntil("#i3") //id为d1标签的上面所有标签,直到找到id为i3的标签停止寻找
$("#d1").next() //id为d1标签的下一个标签
$("#d1").nextAll() //id为d1标签的下面所有标签
$("#d1").nextUntil("#i3") //id为d1标签的下面所有标签,直到找到id为i3的标签停止寻找
$("#d1").parent().parent() //id为d1标签的父标签的父标签,(链式查找)
$("#d1").parents() //id为d1标签的所有父辈标签,(一直向上找到html标签)
$("#d1").children() //儿子们
$("#d1").siblings() //兄弟们
$("#d1").find("p") //id为d1标签里面的p标签
属性选择器
$("input[name='hobby']") // 找到name属性等于hobby的input框
表单常用筛选
$(":text") // 找到type=text的input框
...
...
$(":text") // 找到type=button的input框
$(":disabled") // 找到含有disabled的input框
$(":checked") // 找到已被选中的checkbox框
jQuery操作样式类
$("d1").addClass("c1") 为id为d1的标签添加c1属性
$("d1").removeClass("c1") 为id为d1的标签删除c1属性
$("d1").hasClass("c1") 判断id为d1的标签是否有c1属性(返回true和false)
$("d1").toggleclass("c1") 判断id为d1的标签是否有c1属性,有就删除,没有就添加
$('#id').parents(); 父节点
parent() 方法返回被选元素的直接父元素。
parents() 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>)。
$('#id').children(); 子节点
$('#id').siblings(); 所有的兄弟节点
$('#id').prev(); 前一个兄弟节点
$('#id').prevaAll(); 之前所有的兄弟节点
$('#id').next(); 之后第一个兄弟节点
$('#id').nextAll(); 之后所有的兄弟节点