事件

bind() 方法为被选元素添加一个或多个事件处理程序，并规定事件发生时运行的函数。

语法

$(selector).bind(event,data,function)

当元素失去焦点时发生 blur 事件。

blur() 函数触发 blur 事件，或者如果设置了 function 参数，该函数也可规定当发生 blur 事件时执行的代码。

语法

$(selector).blur()

当元素的值发生改变时，会发生 change 事件。

$(selector).change()

当点击元素时，会发生 click 事件。

语法

$(selector).click()

当双击元素时，会发生 dblclick 事件。

语法

$(selector).dblclick()

delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。

使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。

语法

$(selector).delegate(childSelector,event,data,function)

die() 方法移除所有通过 live() 方法向指定元素添加的一个或多个事件处理程序。

语法

$(selector).die(event,function)

当元素遇到错误（没有正确载入）时，发生 error 事件。

语法

$(selector).error()

显示鼠标指针的位置：

$(document).mousemove(function(e){
  $("span").text("X: " + e.pageX + ", Y: " + e.pageY);
});

亲自试一试

定义和用法

pageX() 属性是鼠标指针的位置，相对于文档的左边缘。

语法

event.pageX

pageY() 属性是鼠标指针的位置，相对于文档的上边缘。

语法

event.pageY

preventDefault() 方法阻止元素发生默认的行为（例如，当点击提交按钮时阻止对表单的提交）。

语法

event.preventDefault()

result 属性包含由被指定事件触发的事件处理器返回的最后一个值，除非这个值未定义。

语法

event.result

实例

显示哪个 DOM 元素触发了事件：

$("p, button, h1, h2").click(function(event){
  $("div").html("Triggered by a " + event.target.nodeName + " element.");
});

亲自试一试

定义和用法

target 属性规定哪个 DOM 元素触发了该事件。

语法

event.target

.Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态

完整的 key press 过程分为两个部分：1. 按键被按下；2. 按键被松开。

当按钮被按下时，发生 keydown 事件。

语法

$(selector).keydown()

当按钮被松开时，发生 keyup 事件。它发生在当前获得焦点的元素上。

bind与live和delegate的区别；

bind选中当前存在的元素；

live选中当前存在的元素和未来出项的元素；

delegate选中当前被选元素的子元素和未来的子元素；

当指定的元素（及子元素）已加载时，会发生 load() 事件。

该事件适用于任何带有 URL 的元素（比如图像、脚本、框架、内联框架）。

语法

$(selector).load(function)

当鼠标指针移动到元素上方，并按下鼠标按键时，会发生 mousedown 事件。

语法

$(selector).mousedown()

当鼠标指针穿过元素时，会发生 mouseenter 事件。

语法

$(selector).mouseenter()

当鼠标指针离开元素时，会发生 mouseleave 事件。

语法

$(selector).mouseleave()

当鼠标指针在指定的元素中移动时，就会发生 mousemove 事件。

语法

$(selector).mousemove()

当鼠标指针从元素上移开时，发生 mouseout 事件。

语法

$(selector).mouseout()

不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。

只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。

当鼠标指针位于元素上方时，会发生 mouseover 事件

与 mouseenter 事件不同，不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件

语法

$(selector).mouseover()

当在元素上放松鼠标按钮时，会发生 mouseup 事件。

语法

$(selector).mouseup()

与 click 事件不同，mouseup 事件仅需要放松按钮，而click只能是鼠标左键，mouseup不管是什么键只要按住后松开了就激活了

one() 方法为被选元素附加一个或多个事件处理程序，并规定当事件发生时运行的函数。

当使用 one() 方法时，每个元素只能运行一次事件处理器函数。

$(selector).one(event,data,function)

***当 DOM（文档对象模型） 已经加载，并且页面（包括图像）已经完全呈现时，会发生 ready 事件。

ready() 函数规定当 ready 事件发生时执行的代码。

ready() 函数仅能用于当前文档，因此无需选择器。

允许使用以下三种语法：

语法 1

$(document).ready(function)

语法 2

$().ready(function)

语法 3

$(function)

当调整浏览器窗口的大小时，发生 resize 事件。

语法

$(selector).resize()

当用户滚动指定的元素时，会发生 scroll 事件。

scroll 事件适用于所有可滚动的元素和 window 对象（浏览器窗口）。

语法

$(selector).scroll()

当 textarea 或文本类型的 input 元素中的文本被选择时，会发生 select 事件。

select() 方法触发 select 事件，或规定当发生 select 事件时运行的函数。

语法

$(selector).select()

当提交表单时，会发生 submit 事件。

语法

$(selector).submit()

toggle() 方法用于绑定两个或多个事件处理器函数，以响应被选元素的轮流的 click 事件。

该方法也可用于切换被选元素的 hide() 与 show() 方法。

实例

切换不同的背景色：

$("p").toggle(
  function(){
  $("body").css("background-color","green");},
  function(){
  $("body").css("background-color","red");},
  function(){
  $("body").css("background-color","yellow");}
);

亲自试一试

语法

$(selector).toggle(function1(),function2(),functionN(),...)

trigger() 方法触发被选元素的指定事件类型。

语法

$(selector).trigger(event,[param1,param2,...])

triggerHandler() 方法触发被选元素的指定事件类型。但不会执行浏览器默认动作，也不会产生事件冒泡。

效果

animate() 方法执行 CSS 属性集的自定义动画。

$(selector).animate(styles,speed,easing,callback)

语法 2

$(selector).animate(styles,options)

clearQueue() 方法停止队列中所有仍未执行的函数。

与 stop() 方法不同，（只适用于动画），clearQueue() 能够清除任何排队的函数（通过 .queue() 方法添加到通用 jQuery 队列的任何函数）。

语法

$(selector).clearQueue(queueName)

fadeIn() 方法使用淡入效果来显示被选元素，假如该元素是隐藏的。

语法

$(selector).fadeIn(speed,callback)

fadeOut() 方法使用淡出效果来隐藏被选元素，假如该元素是隐藏的。

语法

$(selector).fadeOut(speed,callback)

fadeTo() 方法将被选元素的不透明度逐渐地改变为指定的值。

语法

$(selector).fadeTo(speed,opacity,callback)

show()如果被选的元素已被显示，则隐藏该元素。

语法

$(selector).hide(speed,callback)

slideDown() 方法通过使用滑动效果，显示隐藏的被选元素。

语法

$(selector).slideDown(speed,callback)

slideToggle() 方法通过使用滑动效果（高度变化）来切换元素的可见状态。

如果被选元素是可见的，则隐藏这些元素，如果被选元素是隐藏的，则显示这些元素。

语法

$(selector).slideToggle(speed,callback)

slideUP()通过使用滑动效果，隐藏被选元素，如果元素已显示出来的话。

语法

$(selector).slideUp(speed,callback)

stop() 方法停止当前正在运行的动画。

语法

$(selector).stop(stopAll,goToEnd)

toggle() 方法切换元素的可见状态。

如果被选元素可见，则隐藏这些元素，如果被选元素隐藏，则显示这些元素。

语法

$(selector).toggle(speed,callback,switch)

文档操作

addClass() 方法向被选元素添加一个或多个类。

该方法不会移除已存在的 class 属性，仅仅添加一个或多个 class 属性。

提示：如需添加多个类，请使用空格分隔类名。

语法

$(selector).addClass(class)

after() 方法在被选元素后插入指定的内容。在后面添加新标签

语法

$(selector).after(content)

append() 方法在被选元素的结尾（仍然在内部）插入指定内容。

提示：append() 和 appendTo() 方法执行的任务相同。不同之处在于：内容的位置和选择器。

语法

$(selector).append(content)

attr() 方法设置或返回被选元素的属性值。

返回属性值

返回被选元素的属性值。

语法

$(selector).attr(attribute)

before() 方法在被选元素前插入指定的内容。

语法

$(selector).before(content)

clone() 方法生成被选元素的副本，包含子节点、文本和属性。

语法

$(selector).clone(includeEvents)

detach() 方法移除被选元素，包括所有文本和子节点。

这个方法会保留 jQuery 对象中的匹配的元素，因而可以在将来再使用这些匹配的元素。

detach() 会保留所有绑定的事件、附加的数据，这一点与 remove() 不同。

语法

$(selector).detach()

  $("button").click(function(){
    $("body").append($("p").detach());    append($("p").detach() == p标签原来的所以元素和                                            绑定事件
  });

empty() 方法从被选元素移除所有内容，包括所有文本和子节点。

语法

$(selector).empty()

hasClass() 方法检查被选元素是否包含指定的 class。

语法

$(selector).hasClass(class)

html() 方法返回或设置被选元素的内容 (inner HTML)。

如果该方法未设置参数，则返回被选元素的当前内容。

返回元素内容

当使用该方法返回一个值时，它会返回第一个匹配元素的内容。

语法

$(selector).html()

insertAfter() 方法在被选元素之后插入 HTML 标记或已有的元素。

注释：如果该方法用于已有元素，这些元素会被从当前位置移走，然后被添加到被选元素之后。

语法

$(content).insertAfter(selector)

insertBefore() 方法在被选元素之前插入 HTML 标记或已有的元素。

注释：如果该方法用于已有元素，这些元素会被从当前位置移走，然后被添加到被选元素之前。

语法

$(content).insertBefore(selector)

prepend() 方法在被选元素的开头（仍位于内部）插入指定内容。

提示：prepend() 和 prependTo() 方法作用相同。差异在于语法：内容和选择器的位置，以及 prependTo() 无法使用函数来插入内容。

语法

$(selector).prepend(content)

prependTo() 方法在被选元素的开头（仍位于内部）插入指定内容。

提示：prepend() 和 prependTo() 方法作用相同。差异在于语法：内容和选择器的位置，以及 prepend() 能够使用函数来插入内容。

语法

$(content).prependTo(selector)

remove() 方法移除被选元素，包括所有文本和子节点。

该方法不会把匹配的元素从 jQuery 对象中删除，因而可以在将来再使用这些匹配的元素。

但除了这个元素本身得以保留之外，remove() 不会保留元素的 jQuery 数据。其他的比如绑定的事件、附加的数据等都会被移除。这一点与 detach() 不同。

语法

$(selector).remove()

removeAttr() 方法从被选元素中移除属性。

语法

$(selector).removeAttr(attribute)

removeClass() 方法从被选元素移除一个或多个类。

注释：如果没有规定参数，则该方法将从被选元素中删除所有类。

语法

$(selector).removeClass(class)

replaceAll() 方法用指定的 HTML 内容或元素替换被选元素。

提示：replaceAll() 与 replaceWith() 作用相同。差异在于语法：内容和选择器的位置，以及 replaceWith() 能够使用函数进行替换。

语法

$(content).replaceAll(selector)

replaceWith() 方法用指定的 HTML 内容或元素替换被选元素。

提示：replaceWith() 与 replaceAll() 作用相同。差异在于语法：内容和选择器的位置，以及 replaceAll() 无法使用函数进行替换。

语法

$(selector).replaceWith(content)

$(selector).replaceWith(function())

text() 方法方法设置或返回被选元素的文本内容。

我认为差异几乎是不言自明的。测试它是非常重要的。

jQuery.html()将字符串视为HTML，jQuery.text()将内容视为文本

toggleClass() 对设置或移除被选元素的一个或多个类进行切换。

该方法检查每个元素中指定的类。如果不存在则添加类，如果已设置则删除之。这就是所谓的切换效果。

不过，通过使用 “switch” 参数，您能够规定只删除或只添加类。

语法

$(selector).toggleClass(class,switch)

unwrap() 方法删除被选元素的父元素。

语法

$(selector).unwrap()

val() 方法返回或设置被选元素的值。

元素的值是通过 value 属性设置的。该方法大多用于 input 元素。

如果该方法未设置参数，则返回被选元素的当前值。

语法

$(selector).val(value)

wrap() 方法把每个被选元素放置在指定的 HTML 内容或元素中。变成这个被选元素的父元素

语法

$(selector).wrap(wrapper)

实例

在

$(".btn1").click(function(){
   $("p").wrapAll("<div></div>");
});

$(selector).wrapAll(wrapper)

$(selector).wrapInner(wrapper)

$(".btn1").click(function(){
  $("p").css("color","red");
});

$(selector).css(name)

$(selector).height()

$(selector).offset()

.add(selector)

.children(selector)

.closest(selector)

.contents()

$(selector).each(function(index,element))

.eq(index)

.find(selector)

.first()

.has(selector)

.is(selector)

.last()

.not(selector)

$("p").not("#selected")

$("p").parent(".selected")

.parent(selector)

$("#btn1").click(function(){
  $("div").data("greeting", "Hello World");
});
$("#btn2").click(function(){
  alert($("div").data("greeting"));
});

$(selector).data(name)

.dequeue(queueName)

$(selector).removeData(name)

$(selector).get(index)

$(selector).index()

$(selector).size()

$(selector).toArray()