一、基础选择器
1,id选择器 $("#my_id") 根据id获取jquery对象;
2,元素选择器 (element选择器、标签选择器) $("button") 根据元素名获取对象,可能为数组;
3,class选择器 $(“.class”) 根据class类选择对象,可能为数组;
4,*号选择器 $(“*”) 选择页面全部元素;
5,逗号选择器(多项选择器) $(“sele1,sele2,seleN”),如$(".red,.green")、$(".red,div")选择不同类型的对象,用逗号隔开;
6,空格选择器(层次选择器,父子孙选择器) $("ance desc"),如$("div span"),选择div下的所有span,空格隔开;
7,>号选择器(父子选择器) $(“parent > child”) 如$(“parent > child”),获取的是<div>“家庭中”全部“子辈”<span>元素,用>号隔开,只选择临辈子元素;
8,+号选择器(临近选择器),如$("p + label")选择器,获取<p>元素最近邻的下一个label元素;
9,~号选择器(同辈后边相邻所有选择器)如$("p~label"),选择p后所有同级label;
二、过滤性选择器
1,:first过滤选择器 如$(“li:first”),选择第一个li
2,:eq(index)过滤选择器,如 $("li:eq(2)"),选择第3个li
3,:contains(text)过滤选择器,如$("li:contains('jQuery')"),选择内容包括jQuery的li
4,:has(selector)过滤选择器,如$("li:has('p')"),选择获取包含p标签的li
5,:hidden过滤选择器,如$("input:hidden"),选择所有隐藏的input元素
6,:visible过滤选择器,如$("li:visible"),选择所有可见的li,和:hidden相反
7,[attribute=value]属性选择器,获取属性名属性值都匹配的元素,如$("li[title='蔬菜']")
8,[attribute!=value]属性选择器,获取不包含属性名,或者与属性名和属性值不相同的全部元素,如$("li[title!='蔬菜']")
9,[attribute*=value]属性选择器,获取属性值中包含指定内容的全部元素,其中[]是专用于属性选择器的括号符,如$("li[title*='果']"),title中有“果”字的li
10,:first-child子元素过滤选择器,获取每个父元素中返回的首个子元素,它是一个集合,注意和:first的区别
三、表单选择器
1,:input表单选择器,获取表单全部元素,如$("#frmTest :input"),获取id为frmTest表单的所有元素
2,:text表单文本选择器,获取表单中全部单行的文本输入框元素,如$("#frmTest :text"),获取
id为frmTest表单的所有单行文本
3,:password表单密码选择器,获取表单中全部的密码输入文本框元素,如$("#frmTest :password")
4,:radio单选按钮选择器
5,:checkbox复选框选择器
6,:submit提交按钮选择器
7,:button表单按钮选择器
8,:checked选中状态选择器,用于单复选框
9,:selected选中状态选择器,用于下拉列表
四,操作DOM的常用方法
1,.attr("属性名","属性值") 设置标签属性
2,.html()、.text(),text只获取文本,html获取节点的所有内容,包括子节点
3,.addClass(样式类列表,空格隔开)、.css("样式名","样式值"),设置样式
4,使用removeAttr(name)和removeClass(class)分别可以实现移除元素的属性和样式的功能,前者方法中参数表示移除属性名,后者方法中参数则表示移除的样式名
5,使用append()方法向元素内追加内容,$("body").append($html),追加jquery对象
6,$(content).appendTo(selector),顺序和append相反
7,使用before()和after()在元素前后插入内容
8,$(selector).clone()复制元素
9,replaceWith()和replaceAll()方法都可以用于替换元素或元素中的内容,但它们调用时,内容和被替换元素所在的位置不同,分别为如下所示:$(selector).replaceWith(content)和$(content).replaceAll(selector)。参数selector为被替换的元素,content为替换的内容
10,使用wrap()和wrapInner()方法包裹元素和内容。前者用于包裹元素本身,后者则用于包裹元素中的内容
11,使用each()方法遍历元素。$(selector).each(function(index))在遍历时,通过回调函数返回遍历元素的序列号,根据index进行操作。
12,使用remove()和empty()方法删除元素。remove()方法删除所选元素本身和子元素,该方法可以通过添加过滤参数指定需要删除的某些元素,而empty()方法则只删除所选元素的子元素。如:remove(".red")方法只是把<span>元素中类别名为“red”的这部分元素给删除了