jQuery 常用速查

jQuery 速查

基础

• $("css 选择器") 选择元素，创建jquery对象
• $("html字符串") 创建jquery对象
• $(callback) $(document).ready() 的简写
• length/size() jquery对象中元素的个数
• get() 取得DOM元素集合
• get(index) 取得DOM元素

选择器

• #id,element,.class,* ,... 类似于css选择器

获得/设置属性

• attr(property) 获取/设置属性值
• addClass(class) 添加类名
• hasClass(class) 若有类则为 true,否则为 false
• removeClass([class]) 删除类，多个类以空格隔开，若不指定则删除全部类
• html(val) 获取/设置 html 内容
• text(val) 获取/设置文本内容
• val(val) 获取/设置值

筛选

• eq(index) 获取指定位置的元素
• first() 获取第一个元素
• last() 获取最后元素

查找

• children() 获取直接子元素
• find() 获取子元素
• next() 获取下一个同辈元素
• nextAll() 获取后面所有同辈元素
• parent() 获取直接父元素
• prev() 获取上一个同辈元素
• prevAll() 获取前面所有同辈元素
• siblings() 获取所有同辈元素

DOM操作

• append(content) 追加内容
• appendTo(element) 追加内容到元素中
• prepend(content) 前置内容
• prependTo(element) 前置内容到元素中
• after(content) 插入到元素后面
• before(content) 插入到元素之前
• insertAfter(element) 插入内容到元素之后
• insertBefore(element) 插入内容到元素之前
• empty() 删除所有子节点

CSS操作

• css() 获取css属性
• css(name,value) 设置css属性
• css({name:value,name1:value}) 设置多个css属性
• offset() 获取相对于浏览器窗口的偏移
• position() 获取相对于父元素的偏移
• height() 获取/设置高度值
• width() 获取/设置宽度值
• innerHeight() 获取内部高度值（不包括border）
• innerWidth() 获取内部宽度值（不包括border）
• outerHeight() 获取外部高度值（包括border)
• outerWidth() 获取外部宽度值（包括border)

事件

• on(event,handler) 元素绑定事件
• hover(over,out) 鼠标悬停事件
• toggle(fn1,fn2,...) 点击依次调用事件
• click() 触发每一个匹配元素的 click 事件
• click(fn) 元素 click 事件绑定一个函数
• blur(),change(),focus(),select(),submit(),load() 等事件
• keydown(),keyup(),keypress() 键盘事件
• mouseenter(),mouseover(),mouseout() 鼠标事件

动画/效果

• show() 显示
• show(speend,[callback]) 显示并触发回调函数
• hide() 隐藏
• hide(speed,[callback]) 隐藏并触发回调函数
• toggle() 切换元素的可见状态
• slideDown(speed,[callback]) 向下滑动，高度增加，并触发回调
• slideUp(speed,[callback]) 向上滑动，高度减少，并触发回调
• fadeIn(speed,[callback]) 淡入，并触发回调
• fadeOut(speed,[callback]) 淡出，并触发回调
• fadeTo(speed,opacity,[callback]) 指定透明度，并触发回调

ajax

• $.ajax(options) ajax请求
• $.get(url,[data],[callback],[type]) get请求
• $.post(url,[data],[callback],[type]) post请求

其他

• $.each(obj,callback) 通用，遍历对象和数组
• $.isArray(obj) 检测参数是否是数组
• $.isFunction(obj) 检测参数是否是 function
• $.trim() 去除字符串首尾空格
• $.parseJSON(jsonText) 解析json字符串为javascript对象
• data(name) 返回 data-* 自定义属性值
• data(name,value) 设置 data-* 自定义属性值

事件对象

• event.currentTarget 事件冒泡阶段的当前DOM元素
• event.preventDefault() 阻止默认事件行为的触发