相关手册
jQuery 在线手册
基 础

核心函数

$("sel") 获取元素,通过选择器获取元素 $(条件,集合) 筛选元素,筛选出符合条件的元素 $(htm,att) 创建元素,用 html 字符串创建一个元素,创建完要绑定节点才行 $(dom) 对象转换,将 JS DOM 对象转换为 jQuery 对象 $(function(){ }) 立即执行,等待页面加载完成后立即执行回调函数 $(this) 当前元素,指向当前元素

访问集合中的元素

length 集合中元素个数,获取集合中总共有几个元素 index() 集合中元素序号,获取当前元素在集合中的序号 eq(n) 集合中的元素, 获取集合中第几个元素( jQ 对象) get(n) 集合中的元素, 获取集合中第几个元素( JS 对象)

获取选择器的参数

selector 获取选择器里的参数

字符串操作

$.globalEval(str) 字符串转 JS, 将字符串转为 JS 代码,全局性执行 $.parseJSON(str) 字符串转 JSON,将符合标准格式的的 JSON 字符串转为 JSON 对象 $.parseXML(str) 字符串转 XML, 将字符串解析为对应的XML文档

数组操作

map(data, fun) 遍历 - 返回新的数组,于遍历数据,可对数据增删,并返回一个新的 JS 数组 $.inArray(txt, arr) 获取 - 数组索引值, 在数组中查找指定值,并返回它的索引值 $.merge(arr1, arr2) 合并 - 两个数组, 合并两个数组内容到第一个数组 $.grep(arr, fun, boo) 筛选 - 过滤数组, 将数组通过函数过滤,并返回过滤后的数组 $.grep(obj) 转换 - 类数组转数组,将一个类似数组的对象转换为真正的数组对象 toArray() 转换 - 类数组转数组,将一个类似数组(集合)的对象转换为真正的数组对象

对象操作

each(obj, fun) 遍历 - 数组/对象 $.extend(dee, tar,obj1, obj2 ...) 合并 - 对象,将一个或多个对象的内容合并到目标对象 $.when(def) 执行 - 多个对象,执行一个或多个对象的回调函数

函数操作

$.noop 获取时间,返回自1970年1月1日至当前时间之间的毫秒数 $.noop 空函数 $.proxy(obj,met) 执行对象的方法,接受一个已有的函数,并执行函数的方法(对象的属性)

查询对象

$.type(obj) 查询 - 数据类型,查询对象属于什么数据类型 $.isPlainObject(obj) 是否 - 为对象, 查询对象是否为一个纯粹的对象 $.isEmptyObject(obj) 是否 - 为空对象,查询对象是否为空(不包含任何属性) $.isArray(obj) 是否 - 为数组, 查询对象是否为一个数组 $.isFunction(obj) 是否 - 为函数, 查询对象是否为一个函数 $.isNumeric(obj) 是否 - 为数值, 查询对象是否为一个数值 $.isWindow(obj) 是否 - 为窗口, 查询对象是否为一个窗口

jQ 对象与 JS DOM 对象之间相互转换

$(JQ) JS 转 jQ ,将 JS 元素对象放在 $() 里即可 $()[n] jQ 转 JS $().get(n) jQ 转 JS toArray() jQ 转 JS 数组

数据缓存

data(name, val) 附加数据,向元素上附加数据,返回jQuery对象 data(JSON) 附加数据,向元素上附加数据,返回jQuery对象 data(name) 读取数据,读取元素的附加数据 removeData(att) 移除数据,移除之前通过 data() 方法附加的数据 $.hasData(dom) 是否已添加数据,查询元素是否附加了数据

插件机制

$.fn.extend(JSON) 为 jQuery 的原型添加新的方法 $.extend(JSON) 为 jQuery 的原型添加新的属性

多库共存

noConflict(bool) 修改 jQuery 语法开头,来避免与其他库开头($)的冲突
选 择 器

条件选择器

$("div,#id") 定义多个选择器,选择器之间用 "," 分隔 $("p.class") 通过并且方式(交集)获取元素 $(":not(选择器)") 获取与选择器条件相反的所有元素

基本选择器

$(this) 当前元素,当前触发事件的元素,谁触发事件指的就是谁 $("*") 获取所有元素 $("tagName") 通过标签名获取元素 $("#id") 通过 id 属性值获取元素 $(".class") 通过 class 属性值获取元素

层级选择器

$(".class ul li") 后代, 通过后代路径获取元素 $("ul>li") 子代, 仅获取到子代,后代不获取 $("div+p") 兄弟元素,获取后面的同级(兄弟)第一个元素 $("div~p") 兄弟元素,获取后面所有的同级(兄弟)元素

属性选择器

$("[属性]") 含有该属性的所有元素 $("[属性 = 值]") 属性值 - 完全匹配, 含有该属性,且属性值完全匹配该值的所有元素 $("[属性 != 值]") 属性值 - 不等于, 含有该属性,且属性值不等于该值的所有元素 $("[属性 *= 值]") 属性值 - 局部匹配, 含有该属性,且属性值中局部含有该值的所有元素 $("[属性 ~= 值]]") 属性值 - 单词匹配, 含有该属性,且属性值中含有该独立单词的所有元素 $("[属性 ^= 值]") 开头含有,含有该属性,且属性值开头为该值的所有元素 $("[属性 $= 值]") 末尾含有,含有该属性,且属性值末尾为该值的所有元素

位置选择器

$(":eq(n)") 第几个元素, 获取集合里第几个元素,n 从 0 开始 $(":lt(n)") 第几个前面的元素,获取集合里第几个前面的所有元素,n 从 0 开始 $(":gt(n)") 第几个后面的元素,获取集合里第几个后面的所有元素,n 从 0 开始 $(":first") 第一个元素, 获取集合里第一个元素 $(":last") 最后一个元素, 获取集合里最后一个元素 $(":even") 偶数元素, 获取集合里偶数的元素 $(":odd") 奇数元素, 获取集合里奇数的元素

关系选择器

$(":first-child") 第一个位置的子元素 $(":last-child") 最后一个位置的子元素 $(":first-of-type") 第一次出现的子元素 $(":last-of-type") 最后一次出现的子元素 $("nth-child()") 第 N 个位置的子元素 $(":nth-last-child()") 倒数第 N 个位置的子元素 $(":nth-of-type()") 第N 次出现的子元素 $(":nth-last-of-type()") 倒数第 N 次出现的子元素

内容选择器

$(":contains(text)") 字符串查元素, 获取集合中包含有指定字符串的所有元素 $(":empty") 空节点的元素, 获取所有空节点的元素 $(":parent") 不为空节点的元素,获取所有不为空节点的元素 $(":has(选择器)") 包含, 获取所有包含有该选择器的元素

表单选择器

$(":input") 所有 input, 获取所有 input、textarea、select、button 元素 $(":enabled") 所有 input (启用的),获取所有启用(不含禁用)的 input 和 button 元素 $(":disabled") 所有 input (禁用的),获取所有禁用的 input 和 button 元素 $(":checked") 单选 / 复选, 获取所有被选中的单选或复选按钮元素 $(":selected") 下拉列表, 获取所有被选取的下拉选项元素 获取所有 type="类型" 的 input 元素 $(":text") 文本框 $(":password") 密码框 $(":radio") 单选按钮 $(":checkbox") 复选按钮 $(":file ") 上传文件 $(":hidden") 隐藏元素 $(":reset") 重置按钮 $(":submit") 提交按钮 $(":button") 普通按钮 $(":image") 图片按钮

其他选择器

$(":visible") 可见元素, 获取所有可见(不含隐藏)的 HTML 元素 $(":hidden") 隐藏元素, 获取所有被隐藏的 HTML 元素 $(":focus") 获取焦点, 获取当前在页面中获取焦点的元素 $("document") 获取文档 $(":root") 获取根元素,就是 html $(":header") 标题元素, 获取所有标题 h1 - h6 元素 $(":animated") 动画元素, 获取所有正在执行动画的元素
遍 历

判断查询

hasClass(cls) 当前元素 - 是否含有某类 is(sel) 集合中 - 是否含有该条件的(至少1个)元素

元素位置

eq(n) 第几个元素, 获取集合里的第几个元素 slice(n, m ) 元素区间范围,获取集合里从第 n 个元素(含)至第 m 个元素(不含)之间的元素 first() 第一个元素, 获取集合里的第一个元素 last() 最后一个元素,获取集合里的最后一个元素

元素关系

祖父元素 parent() 获取 当前元素的父元素 parents([ex]) 获取 当前元素的所有祖先元素(父、祖父、曾祖父,依此类推) parentsUntil([stop, ex]) 获取 当前元素至 [stop] 元素区间的所有祖先元素(父、祖父、曾祖父,依此类推) 子元素 children([ex]) 获取 当前元素的(指定)子元素,仅元素节点,不能够获取元素的文本节点 contents([ex]) 获取 当前元素的(指定)子节点,能够获取元素的元素节点、文本节点、注释节点 后代元素 find(ex) 获取 当前元素的指定后代元素 兄弟元素 siblings([ex]) 获取 当前元素的所有兄弟元素(不包含自己) prev() 获取 当前元素前一个兄弟元素 prevAll([ex]) 获取 当前元素之前的所有兄弟元素(不包含自己) prevUntil([stop, ex]) 获取 当前元素之前至 [stop] 元素区间的所有兄弟元素 next() 获取 当前元素后一个兄弟元素 nextAll([ex]) 获取 当前元素的所有之后兄弟元素(不包含自己) nextUntil([stop, ex]) 获取 当前元素之后至 [stop] 元素区间的所有兄弟元素 定位的父元素 offsetParent() 获取 第一个使用了定位属性 position 的祖先元素

添加元素

add(ele, sel) 给集合添加新元素,将匹配的元素添加到获得的集合中去,获得一个新的集合

集合重组

addBack() 新旧集合重新组合,把之前获取的集合添加到当前获取的集合中,返回一个新的集合

集合筛选

filter(sel, fun) 获取集合中符合条件的元素 not(sel, fun) 在集合中符合条件的元素移除出去,获取剩下的元素集合

集合遍历

each(fun) 遍历元素集合,每个元素都执行函数 map(data, fun) 遍历数组返回新的数组,每个元素都执行函数,函数传参 data 为 JSON 数据类型
事 件

页面加载

$(function(){ }) 页面加载后执行 $(document).ready(function(){ }) 页面加载后执行 $.holdReady(true|false) 开启或停止 ready() 事件的执行

事件处理

on(eve ,chi, par, fun) 添加事件, 给元素添加一个或多个事件,并执行回调函数 off(eve ,chi, fun) 删除事件, 删除元素已添加的事件 one(eve , par, fun) 添加事件只执行一次, 如果是元素集合,每个元素只能运行一次事件处理程序函数 trigger(eve , par) 执行事件,触发默认事件, 执行指定元素的指定事件及事件的默认行为(比如:获取焦点) triggerHandler(eve , par) 执行事件,不触发默认事件,执行指定元素的指定事件,不触发事件的默认行为

事件对象 event

event.target 获取当前事件对象,获取触发当前事件的元素,就是谁触发事件指的就是谁 event.data 获取事件函数的传参,获取当前事件回调函数的传参 event.result 获取事件函数的返回值,获取指定元素指定事件的返回值

事件函数执行的对象

event.delegateTarget 执行绑定事件的对象,谁绑定的事件,回调函数就执行谁(不管是谁触发的事件) event.currentTarget 执行触发事件的对象,谁触发的事件,回调函数就执行谁

阻止默认事件、阻止重复事件、阻止冒泡事件

event.preventDefault() 阻止元素触发默认事件 event.isDefaultPrevented() 是否使用了阻止默认事件 event.stopImmediatePropagation() 阻止之后重复事件,当同一个选择器绑定了多个一样的事件,当添加了该方法后,之后剩下的事件不会被执行 event.isImmediatePropagationStopped() 是否使用了阻止之后重复事件 event.stopPropagation() 阻止冒泡事件,防止父元素触发事件 event.isPropagationStopped() 是否使用了阻止冒泡事件

获取指针坐标、获取键盘按键编码、获取触发事件类型、获取事件间隔时间

event.pageX 获取鼠标指针在文档里的 X 坐标 event.pageY 获取鼠标指针在文档里的 Y 坐标 event.type 获取触发的事件属于哪种类型事件 event.which 获取用户按下的键盘按键编码 event.timeStamp 获取某元素第一次触发事件至最后一次之间的毫秒数

事件触发 DOM

鼠标事件 click() 单击 dblclick() 双击 contextmenu() 右击 mousedown() 按下 mouseup() 松开 mouseenter() 移入 mouseleave() 移出 mousemove() 移动 hover() 悬停 键盘事件 keydown() 松开 keyup() 松开 表单事件 focus() 获取焦点 blur() 失去焦点 change() 值改变 select() 选取时 submit() 提交后 窗口事件 $(window).resize() 调整窗口触发事件 滚动事件 scroll() 滚动条发生滚动触发事件
元 素 属 性

读取、添加、修改元素属性/值

prop(att) 读取 - 属性值,如果没有相应的属性,返回值是空字符串 attr(att) 读取 - 属性值,如果没有相应的属性,返回值是 undefined prop(att, val) 添加/修改 - 属性/值, attr(att, val) 添加/修改 - 属性/值, prop(att, fun) 添加/修改 - 属性/值,执行回调函数 attr(att, fun) 添加/修改 - 属性/值,执行回调函数

删除元素属性

removeProp(att) 只能删除一个元素属性 removeAttr(att) 删除一个或多个元素属性

类的增删改查

hasClass(cls) 当前元素,是否含有某类 addClass(cls|fun) 添加类名,添加一个或多个类名到 class 属性 removeClass(cls|fun) 删除类名,删除 class 属性中一个或多个类名 toggleClass(cls|fun, bol) 添加和删除类名之间互相切换

值的增删改读

HTML 格式 html() 读取 - 元素值 html(con) 添加/替换 - 元素值 html(fun) 修改 - 元素值 html("") 删除 - 元素值 TEXT 格式 text() 读取 - 元素值 text(con) 添加/替换 - 元素值 text(fun) 修改 - 元素值 text("") 删除 - 元素值 input 单标签 val() 读取 - value 值 val(con) 添加/替换 - value 值 val(fun) 修改 - value 值 val("") 删除 - value 值
元 素 样 式

CSS 增删读改

css(pro) 读取 - CSS 属性值 text(pro, val) 添加/修改 - CSS 属性/值 text(pro, fun) 添加/修改 - CSS 属性/值,执行回调函数 css(pro, "") 删除 - CSS 属性值

元素宽高读改

width() 读取 - 元素宽度 height() 读取 - 元素高度

元素位置读改

position() 读取 - 元素偏移坐标,相对于父元素 offset() 读取 - 元素偏移坐标,相对于文档 offset({top:x, left:y}) 设置 - 元素偏移坐标 offset(fun) 设置 - 元素偏移坐标,使用回调函数

滚动条位置

scrollTop() 读取 - 滚动条垂直位置 scrollLeft() 读取 - 滚动条水平位置 scrollTop(n) 设置 - 滚动条垂直位置 scrollLeft(n) 设置 - 滚动条水平位置
元 素 动 画

元素显隐

基本显隐(不占原位) show(spe, eas, fun) 显示元素 hide(spe, eas, fun) 隐藏元素 toggle(spe, eas, fun) 显隐切换 滑动显隐(不占原位) slideDown(spe, eas, fun) 滑动显示元素 slideUp(spe, eas, fun) 滑动隐藏元素 slideToggle(spe, eas, fun) 滑动显隐切换 渐变显隐(不占原位) fadeIn(spe, eas, fun) 渐变显示元素 fadeOut(spe, eas, fun) 渐变隐藏元素 fadeToggle(spe, eas, fun) 渐变显隐切换 元素透明度(占原位) fadeTo(spe, opa, fun) 元素透明度

延迟动画

delay(spe, que) 延迟之后,再执行动画效果

停止动画

stop(bl, bg) 停止当前正在运行的动画

自定义动画

animate({css}, spe, eas, fun) CSS 集合,动画时长,动画曲线,回调函数

函数列队

queue() 获取动画列队集合 queue(fun) 向自定义动画 animate() 列队中,插入函数列队 dequeue() 结束函数列队

停止列队

finish() 获取动画列队集合 clearQueue() 获取动画列队集合
操 作 节 点

添加节点

添加子节点 $(this).append(con|fun) 向 $(this) 元素最 后面 插入一个子节点 con|fun $(con).appendTo(sel) 向 sel 元素最 后面 插入一个子元素 $(con) $(this).prepend(con|fun) 向 $(this) 元素最 前面 插入一个子节点 con|fun $(con).prependTo(sel) 向 sel 元素最 前面 插入一个子元素 $(con) 添加兄弟节点 $(this).after(con|fun) 向 $(this) 元素 后面 插入一个兄弟节点 con|fun $(con).insertAfter(sel) 向 sel 元素 后面 插入一个兄弟元素 $(con) $(this).before(con|fun) 向 $(this) 元素 前面 插入一个兄弟节点 con|fun $(con).insertBefore(sel) 向 sel 元素 前面 插入一个兄弟元素 $(con)

删除节点

unwrap() 删除节点 - 父元素 empty() 删除节点 - 后代元素 detach() 删除节点 - 元素本身,保留数据和事件 remove() 删除节点 - 元素本身,不保留数据和事件

替换节点

replaceWith(con|fun) 替换节点 - 当前元素被替换 $(con).replaceAll(sel) 替换元素 - 当前元素为替换内容

复制节点

clone(bol) 复制节点,复制当前元素,包含子节点、文本和属性

包裹节点

wrap(con|fun) 包裹节点 - 集合的每一个元素 wrapInner(con|fun) 包裹节点 - 集合的每一个元素 wrapAll(con) 包裹节点 - 给集合包裹,给集合包裹一个父元素(插到父元素子节点的末尾)
回 调 函 数

$.Callbacks() 创建回调函数列表

$.Callbacks(参数) 创建回调列表对象

$.Callbacks() 的方法

add(fun) 添加函数 fire(par) 执行列表 remove(fun) 删除函数 empty() 清空列表 disable() 禁用回调列表中的函数,都执行不了 lock() 锁定回调列表中的函数,都执行不了 fired() 是否 - 执行过列表 has() 是否 - 已有该函数 disable() 是否 - 禁用列表 locked() 是否 - 锁定列表
jQuery Ajax

Ajax 请求

$.ajax() ajax 方法请求 $.get() get 方法请求 $.post() post 方法请求

Ajax 事件

ajaxStart(fun) 规定第一个 AJAX 请求开始时执行的函数 ajaxSend(fun) 规定 AJAX 请求即将发送时执行的函数 ajaxSuccess(fun) 规定 AJAX 请求成功时执行的函数 ajaxError(fun) 规定 AJAX 请求失败时执行的函数 ajaxComplete(fun) 规定 AJAX 请求完成时(不管成功或失败)执行的函数 ajaxStop() 规定所有的 AJAX 请求完成时执行的函数

序列化表单值

serialize() 序列化表单 - URL字符串, 将表单的值序列化成字符串以便提交给服务器 serializeArray() 序列化表单 - 数组, 将表单的值序列化成数组对象(name 和 value)以便处理数据 param(obj, boo) JSON(或数组)转成 URL 字符串,将 JSON(或数组)转成 URL 编码文本字符串(即 URL 参数键值对)