1.所有API自带遍历
对jQuery对象调用的修改，会自动应用到集合中每个DOM元素上
2.所有API都返回正在查询的结果集合，可使用链式操作对同一个结果集合执行多个操作，$是构造函数，多次创建浪费内存
3.一个API两用：如果提供了新值，就修改。没提供新值，就获取
修改：$(...).css(属性名，值)
获取：$value=$(...).css(属性名)
修改CSS样式：
DOM：elem.style.css属性=值
jquery:elem.css("属性名","值");
绑定事件：dom：elem.onclick=function(){}
jq:$().click(function(){...})
层级选择器：
父子：parent child 所有后代
parent>child 直接子代
兄弟： child1+next 紧邻child1的下一个，且满足next的要求
child1~nextsiblings 不必紧邻，只要满足nextsiblings的要求
过滤选择器
子元素过滤：同css
选择在父元素下指定位置的子元素
first-chid
last-child
nth-child(n/even/odd/2n)
only-child
问题：旧浏览器不支持：last-child nth-child
基本过滤：css中没有
选择查找结果中指定位置的元素
:first/last
:even/odd
:eq/gt/lt(i)
:not(selector)反选一切选择器
基本过滤 vs 子元素过滤
子元素过滤：相对于自己的父元素内定位，下标从1开始
基本过滤：先将所有元素放入结果集中，再在结果集中定义，下标从0开始
内容过滤：根据元素的内容，选择满足条件的父元素
:parent 选择只要包含内容的任意父元素
:contains(text) 选择内容中包含指定文本的父元素
:empty 选择不包含任何内容的空的父元素
:has(selector)
1.查找
表单元素选择器：
:input 选择所有表单元素（input select textarea button）
:[type] 按type属性查找： :text :password :checkbox :radio :submit
状态过滤：
：enabled :checked :disabled :selected
按节点间关系：
1.父子：$(child).parent()
$(parent).children([selector]) 获得parent下直接子元素中符合selector条件的
$(parent).find(selector)获得parent后代元素
$(parent).children().first()
2.修改
内容：
属性：$(...).attr("属性名"[,值])
三大状态：不属于attribute,不能用.attr操作
解决：$(...).prop()
样式：
添加、删除、替换、复制
添加：1.使用HTML代码片段创建新元素 var $elem=$('html代码片段')
如果代码片段中即包含父元素，又包含子元素，则同时创建
2、将新元素挂到DOM树
1.向父元素下添加子元素 $(parent).append($elem) 末尾追加
$(parent).prepend($elem)开头插入
删除：$(...).remove()
替换：$(...).replaceWith($elem/"HTML片段") 用右侧的HTML片段，替换左侧查找到的元素
克隆：复制一个元素
var $elem_copy=$(...).clone() 不带参数的clone方法，只能复制样式或属性，不会复制行为
var $elem_copy=$(...).clone(true)即复制属性，又复制行为
绑定事件
.one:绑定事件处理函数之后，只执行一次，就自动解绑
.mouseover/out vs mouseenter/leave
前者触发子元素的事件会冒泡到父元素，后者触发子元素的事件不会冒泡到父元素
4.利用冒泡
$(parent).delegate("selector",“事件名”,fn)
"selector":过滤只有满足selector的子元素才触发事件
this-->e.target
bind vs delegate
bind直接绑在触发事件的元素上，bind绑定时，要求触发事件的元素必须已经存在
delegate只为父元素添加一个事件监听，delegate可为父元素下动态的元素添加
终极简化：$(...).on/off(...) 绑定/解绑
$(...).on("事件名",fn) -->bind
$(...).on("事件名",“selector”,fn) -->deletage
强调：on代替deletage,要事件名在前，选择器在后
如何在绑定事件时，传入参数：
$(...).on("事件名",function(n){})
模拟触发：用代码模拟触发某个元素上绑定的事件处理函数
$(...).trigger("事件名") 触发找到的元素上绑定的事件函数
页面加载后自动执行
DOMContentLoaded:DOM内容加载完成触发
HTML和JS加载完成后，就提前触发
如何：$(document).ready(function(){}) $(function(){})
window.onload 整个页面内容加载完成才触发
HTML,CSS,JS图片全部完成，才触发
特殊的事件 :hover=mouseover+mouseout
$(...).hover(
function(){..mouserover},
function(){..mouseout}
)
更简化：如果能够将两个函数统一为一个函数，则可省略第二个函数
动画：
自定义动画：$(...).animate({
//动画截止状态的css样式
},speed,easing,callback)
强调：animate仅支持数值属性的渐变
比如：width/height top/left padding/margin borderWidth/borderRadius opacity 不支持颜色动画
排队 还是 并发
并发：一次animate调用的{}内所有css属性并发同时变化
链式操作的先后调用animate中的css属性是排队触发
停止动画：只能停止队列中，当前播放的一个动画
解决：stop(true)
jquery中的类数组操作:
jQuery为类数组对象添加了如下和数组对等的操作
3.添加jQuery全局函数
笔试：$.each(数组/集合，function(i){...})
each直接定义在$构造函数上
对任意数组或类数组对象均可用
$(...).each(function(i){...}) 只能被jQuery查询结果对象使用，仅定义在jQuery查询结果对象的原型对象中
来源：https://www.cnblogs.com/webenjoy/p/12162293.html