jQuery基础

jQuery

1 jQuery介绍

• jQuery 是一个高效、精简并且功能丰富的 JavaScript 工具库
• jQuery极大的简化了JavaScript 编程

2 jQuery的基本使用

2.1 文档就绪事件

$(document).ready(function(){
    code...  
})

//简写
$(function(){
    
})

2.2 jQueryDOM和原生DOM

jQuery 通过$(选择器)获取元素，该元素对象是jqueryDOM。与原生DOM不同
jQueryDOM 是在原生DOM基本上进行的封装，本质上是由原生DOM组成的类数组对象，可以[索引]得到原生DOM
$(原生DOM)转为jQuery DOM

3. jQuery选择器

3.1 基本选择器

同CSS3基本选择器

3.2 层级选择器

同CSS3的层级选择器

空格
>
+
~

3.3 过滤选择器

:first
:last
:eq()   从0开始
:odd    奇数
:even   偶数
:lt()   小于
:gt()   大于
:not(选择器)

3.4 内容选择器

:contains(text)     包含指定文字的元素
:has(选择器)        包含指定子元素的元素
:empty              没有子元素也没有内容的元素
:parent             有子元素或者有内容的元素

3.5 可见性选择器

:hidden
:visible

3.6 属性选择器

[attr]          .list img[title]
[attr=value]    img[title=hello]
[attr!=val]     不等于
[attr^=val]     
[attr$=val]
[attr*=val]     attr属性 包含 val
[][][]

注意
jQuery中没有 ~= 和 |=

3.7 子元素选择器

:first-child
:first-of-type
:last-chile
:last-of-type
:nth-child
:nth-last-child
:nth-last-of-type
:nth-of-type
:only-child
:only-of-type

3.8 表单选择器

:input      所有的表单控件
:text
:password
:radio
:checkbox
:submit
:reset
:button
:file

3.9 表单对象选择器

:disabled
:enabled
:checked
:selected

4 jQuery 筛选器

4.1 过滤

eq(index)   从0开始
first()
last()
filter(选择器)
not(选择器)
has(选择器)
slice(start,end)

4.2 查找

查找 子元素
children([selector])    子元素
find(selector)          后代元素

查找 父元素
parent([selector])
parents([selector])
parentsUntil([selector])
offsetParent()

兄弟元素
next([selector])        后面紧邻的兄弟元素
nextAll([selector])     后面所有的兄弟元素
nextUntil([selector])   后面兄弟元素 指定结束条件
prev([selector])        前面紧邻的兄弟元素
prevAll([selector])     
prevUntil([selector])
siblings([selector])    所有的兄弟元素(除了自己)

其他
closest(selector)       从自己开始往祖先元素找,返回第一个满足条件的

4.3 串联

add()
addBack()
end()