慕课网jQuery

一：样式篇

jQuery对象转化成DOM对象

JavaScript代码

var $div=$('div');//jQuery对象var div=$div[0];  //转化为DOM对象div.style.color='red'; 操作dom对象的属性

DOM对象转化为jQuery对象

JavaScript代码

var div= document.getElementsByTagName('div');var $div=$(div);     //jQuery 对象var $first=$div.first();//第一个div元素$first.css('color','red');

类选择器

$(‘.class’)
getElementsByClassName()

id选择器

$(‘#id’)
getElementById()

元素选择器

$(‘element’)
getElementsByTagName()

全选择器

$(‘*’)
getElementsTagName(‘*’)

层级选择器

选择器 描述 $(“parent > child”) 子选择器：选定所有指定“parent”元素中指定的“child”的直接子元素 $(“ancestor descendant”) 后代选择器：选择给定的祖先元素的所有后代元素 $(“prev+next”) 相邻兄弟选择器：选择所有紧接在“prev”元素后的”next“元素 $(“prev~siblings”) 一般兄弟选择器：匹配“prev”元素之后的所有兄弟元素。具有相同的父元素，并匹配过滤“siblings”选择器

筛选选择器

选择器 描述 $(“:first”) 匹配第一个元素 $(“:last”) 匹配最后一个元素 $(“:not(selector)”) 一个用来过滤的选择器，选择所有去除不匹配给定的选择器元素 $(“:eq(index)”) 在匹配的集合中选择索引值为index的元素 $(“:gt(index)”) 选择匹配集合中所有大于给定index（索引值）的元素 $(“:even”) 选择索引值为偶数的元素，从0开始计数 $(“:odd”) 选择索引值为技术的元素，从0开始计数 $(“:lt(index)”) 选择匹配集合中所有索引值小于给定index参数的元素 $(“:header”) 选择所有标题元素，像h1，h2等 $(“:lang(language)”) 选择指定语言的所有元素 $(“:root”) 选择该文档的根元素 $(“:animated”) 选择所有正在执行动画效果的元素

内容筛选选择器

选择器 描述 $(“:contains(text)”) 选择所有包含指定文本的元素 $(“:parent”) 选择所有含有子元素或者文本的元素 $(“:empty”) 选择所有没有子元素的元素（包含文本节点） $(“:has(selector)”) 选择元素中至少包含指定选择器的元素

可见性筛选选择器

选择器 描述 $(“:visible”) 选择所有显示的元素 $(“:hidden”) 选择所有隐藏的元素

属性筛选器

选择器 描述 `$(“[attribute =’value’]”)` $(“([attribute*=’value’]”) 选择指定属性具有包括一个给定的字符串的元素（选择给定的属性是以包含某些值的元素 $(“[attribute~=’value’]”) 选择指定属性用空格分隔的值中包含一个给定值的元素 $(“[attribute!=’value’]”) 选择指定属性是给定值的元素 $(“[attribute^=’value’]”) 选择不存在指定元素，或者指定的属性值不等于给定值的元素 ("[attribute=’value’]”) 选择指定属性是以给定值结尾的元素，区分大小写 $(“[attribute]”) 选择所有具有指定属相的元素，该元素可以是任何值 $(“[attributeFilter1][attributeFilterN]”) 选择匹配所有指定的属性筛选器的元素

子元素筛选选择器

选择器 描述 $(“:first-child”) 选择所有父级元素下的第一个子元素 $(“:last-child”) 选择所有父级元素下的最后一个子元素 $(“:only-child”) 如果某个元素是其父级元素的唯一子元素，那么它就会被选中 $(“:nth-child(index)”) 选择他们所有父元素的第n个子元素 $(“:nth-last-child(index)”) 选择所有他们父元素的第n个子元素。计数从最后一个开始到第一个

表单元素选择器

选择器 描述 $(“:input”) 选择所有input，textarea，select和button元素 $(“:text”) 匹配所有文本框 $(“:password”) 匹配所有密码框 $(“:radio”) 匹配所有单选按钮 $(“:checkbox”) 匹配所有复选框 $(“:submit”) 匹配所有提交按钮 $(“:image”) 匹配所有图像域 $(“:reset”) 匹配所有重置按钮 $(“:button”) 匹配所有按钮 $(“:file”) 匹配所有文件域

表单对象属性筛选选择器

选择器 描述 $(“:enabled”) 选取可用的表单元素 $(“:disabled”) 选取不可用的表单元素 $(“:checked”) 选取被选中的<input>元素 $(“:selected”) 选取被选中的<option>元素