概述:
轻量级
强大的选择器
出色的DOM操作的封装
可靠的事件处理机制
完善的Ajax
出色的浏览器兼容性
链式操作方式
一、jQuery
约定:如果获取的是
jQuery
Dom
二、选择器详解
a)基本选择器,这个选择器与css样式表的选择器一样
Id
b)层次选择器
空格表示祖先关系
c)基本选择器
[
d)基本选择器
:first
e)内容选择器
:contains('value')
f)可见性选择器
:hidden
g)子元素选择器
:nth-child(even|odd|3n|)
表单选择器
:input
h)表单对象属性选择器
:enabeld
三、属性简介
a)访问属性的方法
Attr(name)
b)Css类
addClass(name)
removeClass()
toggleClass(name)如果存在就删除,不存在就添加一个类
c)HTML代码
Html()
d)文本
text()获取元素中的全部文本属性,包含子元素的文本,也可以传参设置文本
e)值
Val()
Val(function(index,value){})
四、筛选
a)过滤方法
Eq(index)
hasClass(
Filter(expr)参数传入选择器表示过滤
Is(expr)
Map(callback)将一组元素转换成其他数组
Has()保留包含特定后代的元素,去掉那些不含有指定后代的元素。
Not()删除与指定表达式匹配的元素
Slice(start,[end])选取一个匹配的子集
b)查找方法
Children(expr)根据选择器获取子元素
Closest(expr)从本元素开始,逐级向上级元素匹配,并返回最先匹配的元素。
Find(expr)根据选择器发现元素
Next()取一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。nextAll()查找当前元素之后所有的同辈元素。
nextUntil()查找同辈元素,直到遇到匹配的那个元素为止。
offsetParent()返回第一个匹配元素用于定位的父节点。
Parent(expr)根据选择器获取父元素
....
...
c)串联
Contents()查找匹配元素内部所有的子节点
andSelf()加入先前所选的加入当前元素中
End()回到最近的一个
Add(expr,[context])把与表达式匹配的元素添加到jQuery对象中。这个函数可以用于连接分别与两个表达式匹配的元素结果集。
五、文档处理
a)内部插入
append向每个匹配的元素内部追加内容。appendTo相反把元素追加到那
prepend向每个匹配的元素内部前置内容。prependTo与上类似
b)外部插入
After
Before
c)包裹
Wrap()把所有匹配的元素用其他元素的结构化标记包裹起来。
Unwrap()移出元素的父元素
wrapAll()将所有匹配的元素用单个元素包裹起来
wrapInner()将每一个匹配的元素的子内容指定结构包裹起来
d)替换
replaceWith(content)将所有匹配的元素替换成指定的replaceAll(selector)用匹配的元素替换掉所有selector匹配到的元素
e)删除
Empty()删除匹配的元素集合中所有的子节点。
Remove(expr)根据选择器删除此元素
Detach(expr)
f)复制
Clone()复制元素但绑定事件不会复制
Clone(true)复制元素并绑定事件全部会被复制
六、CSS
a)Css方法
Css(name)
Css(properties)
Css(name,value)
b)位置
Offset()获取匹配元素在当前视口的相对偏移。使用
Position()获取匹配元素相对父元素的偏移。
scrollTop()获取匹配元素相对滚动条顶部的偏移。
scrollLeft()获取匹配元素相对滚动条左侧的偏移。
c)尺寸
Height()获取高度,传参可以设置高度
Width()获取宽度传参可以设置宽度
innerHeight()获取第一个匹配元素内部区域高度
innerWidth()获取第一个匹配元素内部区域宽度
outerHeight()获取第一个匹配元素外部高度
outerWidth()获取第一个匹配元素外部宽度