var j = jQuery.noConflict();//这样的话，以后就使用j表示jQuery

了解：$符号通常是jQuery的标识符（别名），一般不改动；$ 定义为 选取 英文是selector的意思。如：

$("#divID") 表示选取 id为divID的元素；

$("input") 表示 选取所有input标签

var $div = $("#divID");

var divElement = $div[0];

var $div = $("#divID");

var divElement = $div.get(0);

var $div = $(divElement);//将dom对象转为jQuery对象

写法一：直写

$(document).ready(function(){

  // 在这里写你的代码...

});

写法二：$(document).ready() 的简写

$(function() {

  // 你可以在这里继续使用$作为别名...

});

用法

描述

$(“#elementID”)

#表示根据id查找；查找id为elementID的元素；建议的用法。所以一般推荐给标签设置ID。

类似：

document.getElementById_x_x_x_x_x_x("elementID") 但两者之间返回类型不同

$(“.className”)

.表示根据class样式名称查找；查找样式名称为className的所有标签

$(“input”)

查找所有input标签

用法

描述

$(“#elementID”).val()

$(“#elementID”).val(“新值”)

分别表示取值和设置值

$(“#elementID”).html()

$(“#elementID”).html(“新值”)

分别表示获取标签内部的html文本内容和设置html文本内容。类似innerHTML

$(“#elementID”).text()

$(“#elementID”).text(“新值”)

分别表示获取标签内部的纯文本内容和设置纯文本内容。

$(“#elementID”).attr(“name”)

$(“#elementID”).attr(“name”,”itcast”)

attr为获取对应属性的值或设置对应属性的值。如果遇上具有 true 和 false 两个属性的属性，如 checked, selected 或者 disabled 则使用prop()

用法

描述

empty()

删除匹配的元素集合中所有的子节点。

each()

以每一个匹配的元素作为上下文来执行一个函数；每次执行传递进来的函数时，函数中的this关键字都指向一个不同的DOM元素。

jQuery.each()

通用例遍方法，可用于例遍对象和数组

jQuery.trim()

去掉字符串起始和结尾的空格。

$.trim("  hello, how are you?  ");去掉字符串起始和结尾的空格。

focus()

定焦或当元素获得焦点时，触发 focus 事件

参数

描述

url

发送请求的地址

data

发送到服务器的数据。将自动转换为请求字符串格式。

type

请求方式 ("POST" 或 "GET")， 默认为 "GET"

dataType

预期服务器返回的数据类型。可用值: xml,html,script,json,jsonp,text

success

请求成功后的回调函数。参数：由服务器返回，并根据dataType参数进行处理后的数据

error

默认: 自动判断 (xml 或 html)) 请求失败时调用此函数。如果发生了错误，错误信息（第二个参数）除了得到null之外，还可能是"timeout", "error", "notmodified" 和 "parsererror"

async

默认设置下，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为 false。注意，同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行

$.ajax({

   type: "POST",

   url: "testServlet",

   data: {"name":"itcast","location":"guangzhou"},

   success: function(msg){

     alert( "Data Saved: " + msg );

   }

});

参数

描述

url

发送请求的地址

data

待发送 Key/value 参数

type

返回内容格式，xml, html, script, json, text, _default

callback

请求成功后的回调函数。参数：由服务器返回，并根据type参数进行处理后的数据

$.get("testServlet", { name: "John", time: "2pm" },

  function(data){

    alert("Data Loaded: " + data);

  });

参数

描述

url

发送请求的地址

data

待发送 Key/value 参数

type

返回内容格式，xml, html, script, json, text, _default

callback

请求成功后的回调函数。参数：由服务器返回，并根据type参数进行处理后的数据

$.post("testServlet", { name: "John", time: "2pm" },

  function(data){

    alert("Data Loaded: " + data);

  });

参数

描述

url

发送请求的地址

data

待发送 Key/value 参数

callback

请求成功后的回调函数。

$.getJSON("testServlet", { name: "John", time: "2pm" }, function(json){

  alert("JSON Data: " + json.users[3].name);

});

参数

描述

url

待载入 JS 文件地址。

callback

请求成功后的回调函数。

$.getScript("test.js", function(){

  alert("Script loaded and executed.");

});

参数

描述

url

待装入 HTML 网页网址

data

待发送 Key/value 参数

callback

请求成功后的回调函数。

$("#divID").load("feeds.jsp", {limit: 25}, function(){

   alert("The last 25 entries in the feed have been loaded");

 });

选择器

描述

返回

#id

根据给定的ID匹配一个元素

单个元素组成的集合

element

根据给定的元素名匹配所有元素

元素集合

.class

根据给定的类匹配元素

元素集合

*

匹配所有元素

元素集合

seletor1,seletor2

…,selectorN

将每一个选择器匹配到的元素合并后一起返回；可以指定任意多个选择器，并将匹配到的元素合并到一个结果内

元素集合

选择器

描述

返回

ancestor descendant

后代元素选择器

$(“div span”)选取

元素集合

parent > child

子元素选择器

$(“div>span”)选取

元素集合

prev + next

相邻元素选择器

$(“.one+div”)选取class为one的下一个

元素集合

prev ~ siblings

兄弟元素选择器

$(“#two~div”)选取Id为two的元素后面的所有

元素集合

选择器

描述

返回

:first

选取第一个元素

$('li:first');

单元素

:last

选取最后一个元素

$('li:last');

单元素

:not(selector)

去除所有与给定选择器匹配的元素。

$("input:not(:checked)")；查找所有未选中的 input 元素

元素集合

:even

选取索引号为偶数的元素，索引号从0开始

$("tr:even")

元素集合

:odd

选取索引号为奇数的元素，索引号从0开始

$("tr:odd”)

元素集合

:eq(index)

选取索引号为index的元素，索引号从0开始

$("tr:eq(1)")

单元素

:gt(index)

选取索引号大于index的元素，索引号从0开始

$("tr:gt(1)")

元素集合

:lt(index)

选取索引号小于index的元素，索引号从0开始

$("tr:lt(1)")

元素集合

:header

选取如 h1, h2, h3之类的标题元素$(":header").css("background", "#EEE")

元素集合

:animated

选取所有正在执行动画效果的元素

$("div:animated")

元素集合

选择器

描述

返回

:contains(text)

选取包含给定文本的元素

$("div:contains('John')")

元素集合

:empty

选取所有不包含子元素或者文本的空元素

$("td:empty")

元素集合

:has(selector)

选取含有选择器所匹配的元素的元素

$("div:has(p)").addClass("text");给所有包含 p 元素的 div 元素添加一个 text 样式

元素集合

:parent

选取含有子元素或者文本的元素

$("td:parent")

元素集合

选择器

描述

返回

:hidden

选取所有不可见元素，或者type为hidden的元素

$("div:hidden")

元素集合

:visible

选取所有的可见元素

$("input:visible")

元素集合

选择器

描述

返回

[attribute]

选取包含给定属性的元素 $("div[id]")

查找所有含有 id 属性的 div 元素

元素集合

[attribute=value]

选取给定的属性是某个特定值的元素 $("input[name='newsletter']") 查找所有 name 属性是 newsletter 的 input 元素

元素集合

[attribute!=value]

选取所有不含有指定的属性，或者属性不等于特定值的元素 $("input[name!='newsletter']") 查找所有 name 属性不是 newsletter 的 input 元素

元素集合

[attribute^=value]

选取给定的属性是以某些值开始的元素

$("input[name^='news']") 查找所有 name 以 'news' 开始的 input 元素

元素集合

[attribute$=value]

选取给定的属性是以某些值结尾的元素

 $("input[name$='letter']") 查找所有 name 以 'letter' 结尾的 input 元素

元素集合

[attribute*=value]

选取给定的属性是以包含某些值的元素

$("input[name*='man']") 查找所有 name 包含 'man' 的 input 元素

元素集合

[attrSel1][attrSel2][attrSelN]

复合属性选择器，需要同时满足多个条件时使用

 $("input[id][name$='man']") 找到所有含有 id 属性，并且它的 name 属性是以 man 结尾的

元素集合

选择器

描述

返回

:nth-child

选取父元素下的第N个子或奇偶元素（index序号从1开始）

$("ul li:nth-child(2)") 在每个 ul 查找第 2 个li

元素集合

:first-child

选取父元素的第一个子元素

$("ul li:first-child") 在每个 ul 中查找第一个 li

元素集合

:last-child

选取父元素中的最后一个子元素 $("ul li:last-child") 在每个 ul 中查找最后一个 li

元素集合

:only-child

如果某个元素是父元素中唯一的子元素，那将会被匹配；如果父元素中含有其他元素，那将不会被匹配。 $("ul li:only-child") 在 ul 中查找是唯一子元素的 li

元素集合

选择器

描述

返回

:input

匹配所有 input, textarea, select 和 button 元素 $(":input") 查找所有的input元素。

元素集合

:text

匹配所有的单行文本框  $(":text")

元素集合

:password

匹配所有密码框

$(":password")

元素集合

:radio

匹配所有单选按钮

$(":radio")

元素集合

:checkbox

匹配所有复选框

$(":checkbox")

元素集合

:submit

匹配所有提交按钮

$(":submit")

元素集合

:image

匹配所有图像域

$(":image")

元素集合

:reset

匹配所有重置按钮

$(":reset")

元素集合

:button

匹配所有按钮，$(":button")

元素集合

:file

匹配所有文件域

$(":file")

元素集合

:hidden

匹配所有不可见元素（display:none），或者type为hidden的元素

$("tr:hidden")

元素集合

选择器

描述

返回

:enabled

选取所有可用元素

$("input:enabled")

元素集合

:disabled

选取所有不可用元素

$("input:disabled")

元素集合

:checked

选取所有被选中的元素（单、复选框）

$("input:checked")

元素集合

:selected

选取所有被选中的选项元素（下拉列表

$("select option:selected")查找所有选中的选项元素

元素集合

属性/方法

描述

append(content|fn)

向每个匹配的元素内部追加内容。$("p").append("Hello");向所有段落中追加一些HTML标记。

appendTo(content)

把所有匹配的元素追加到另一个指定的元素中。使用这个方法是颠倒了常规的$(A).appendTo(B)的操作，即不是把B追加到A中，而是把A追加到B中。

$("p").appendTo("div");把所有段落追加到div元素中

prepend(content|fn)

向每个匹配的元素内部前置内容。$("p").prepend("Hello");向所有段落中前置一些HTML标记代码。

prependTo(content)

把所有匹配的元素前置到另一个、指定的元素元素集合中。使用这个方法是颠倒了常规的$(A).prepend(B)的操作，即不是把B前置到A中，而是把A前置到B中。$("p").prependTo("#foo"); 把所有段落追加到ID值为foo的元素中。

after(content|fn)

在每个匹配的元素之后插入内容。$("p").after("Hello");在所有段落之后插入一些HTML标记代码。

before(content|fn)

在每个匹配的元素之前插入内容。$("p").before("Hello");在所有段落之前插入一些HTML标记代码。

insertAfter(content)

把所有匹配的元素插入到另一个、指定的元素元素集合的后面。使用这个方法是颠倒了常规的$(A).after(B)的操作，即不是把B插入到A后面，而是把A插入到B后面。$("p").insertAfter("#foo");把所有段落插入到一个元素之后。与 $("#foo").after("p")相同

insertBefore(content)

把所有匹配的元素插入到另一个、指定的元素元素集合的前面。使用这个方法是颠倒了常规的$(A).before(B)的操作，即不是把B插入到A前面，而是把A插入到B前面。$("p").insertBefore("#foo");把所有段落插入到一个元素之前。与 $("#foo").before("p")相同。

wrap(html|ele|fn)

把所有匹配的元素用其他元素的结构化标记包裹起来。

$("p").wrap("

unwrap()

这个方法将移出元素的父元素。这能快速取消 .wrap()方法的效果。

$("p").unwrap(); 把所有段落的父元素直接移除

wrapAll(html|ele)

将所有匹配的元素用单个元素包裹起来。$("p").wrapAll("

wrapInner(html|ele|fn)

将每一个匹配的元素的子内容(包括文本节点)用一个HTML结构包裹起来。$("p").wrapInner("");把所有段落内的每个子内容加粗

replaceWith(content|fn)

将所有匹配的元素替换成指定的HTML或DOM元素。

$("p").replaceWith("Paragraph. ");把所有的段落标记替换成加粗的标记。

replaceAll(selector)

用匹配的元素替换掉所有 selector匹配到的元素。

$("Paragraph. ").replaceAll("p");把所有的段落标记替换成加粗标记

empty()

删除、清空匹配的元素集合中所有的子节点。$("p").empty();把所有段落的子元素（包括文本节点）删除

remove([expr])

从DOM中删除所有匹配的元素。$("p").remove();从DOM中把所有段落删除

clone([Even[,deepEven]])

克隆匹配的DOM元素并且选中这些克隆的副本。（传入参数布尔值（true 或者 false）指示事件处理函数是否会被复制。）

$("b").clone().prependTo("p");克隆所有b元素（并选中这些克隆的副本），然后将它们前置到所有段落中。

属性/方法

描述

first()

first() 获取第一个元素。

$('li').first()

last()

last() 获取最后个元素。

$('li').last()

is(expr|obj|ele|fn)

根据选择器、DOM元素或 jQuery 对象来检测匹配元素集合，如果其中至少有一个元素符合这个给定的表达式就返回true。如果没有元素符合，或者表达式无效，都返回false。

$("input[type='checkbox']").parent().is("form");由于input元素的父元素是一个表单元素，所以返回true。

has(expr|ele)

保留包含特定后代的元素，去掉那些不含有指定后代的元素。.has()方法将会从给定的jQuery对象中重新创建一组匹配的对象。

$('li').has('ul').css('background-color', 'red');给含有ul的li加上背景色

find(e|o|e)

搜索所有与指定表达式匹配的元素。

$("p").find("span");从所有的段落开始，进一步搜索下面的span元素。

parent([expr])

取得一个包含着所有匹配元素的唯一父元素的元素集合。

$("p").parent(".selected");查找段落的父元素中每个类名为selected的父元素。

siblings([expr])

取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合。

$("div").siblings();找到每个div的所有同辈元素。

属性/方法

描述

addClass(class|fn)

为每个匹配的元素添加指定的类名 $("p").addClass("selected"); 为匹配的元素加上 'selected' 类

removeClass([class|fn])

从所有匹配的元素中删除全部或者指定的类 $("p").removeClass("selected"); 从匹配的元素中删除 'selected' 类

toggleClass(class|fn[,sw])

如果存在（不存在）就删除（添加）一个类。$("p").toggleClass("selected"); 为匹配的元素切换 'selected' 类

hasClass(class)

检查元素是否含有某个特定的类，如果有，则返回true。

$("div").hasClass("protected")

css(name|pro|[,val|fn])

访问匹配元素的样式属性 $("p").css("color") 取得第一个段落的color样式属性的值。$("p").css("color","red"); 将所有段落字体设为红色

height/width([val|fn])

取得匹配元素当前计算的高/宽度值（px）

$("p").height();$("p").width();

offset([coordinates])

获取匹配元素在当前视口的相对偏移。返回的对象包含两个整型属性：top 和 left，以像素计。此方法只对可见元素有效

var p = $("p:last");

var offset = p.offset();

p.html( "left: " + offset.left + ", top: " + offset.top );

属性/方法

描述

on(eve,[sel],[data],fn)1.7+

在选择元素上绑定一个或多个事件的事件处理函数

$("p").on("click", function(){

   alert( $(this).text() );

});

off(eve,[sel],[fn])1.7+

在选择元素上移除一个或多个事件的事件处理函数。off() 方法移除用.on()绑定的事件处理程序

$("p").off( "click", "**" )

bind(type,[data],fn)

为每个匹配元素的特定事件绑定事件处理函数。

$(document).bind('mousemove',function(e){

   $("#log").text("e.pageX: " + e.pageX + ", e.pageY: " + e.pageY);

});

unbind(t,[d|f])

bind()的反向操作，从每一个匹配的元素中删除绑定的事件。如果没有参数，则删除所有绑定的事件。

$("p").unbind( "click" )

one(type,[data],fn)

为每一个匹配元素的特定事件（像click）绑定一个一次性的事件处理函数。

$("p").one("click", function(){

  alert( $(this).text() );

});

hover([over,]out)

一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。这是一个自定义的方法，它为频繁使用的任务提供了一种“保持在其中”的状态。当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。

$("td").hover(

  function () {

    $(this).addClass("hover");

  },

  function () {

    $(this).removeClass("hover");

  }

);

属性/方法

描述

show([s,[e],[fn]])

显示隐藏的匹配元素。

$("p").show() 显示所有段落

hide([s,[e],[fn]])

隐藏显示的元素。

$("p").hide() 隐藏所有段落

slideDown([s],[e],[fn])

通过高度变化（向下增大）来动态地显示所有匹配的元素，在显示完成后可选地触发一个回调函数。

$("p").slideDown("slow"); 用600毫秒缓慢的将段落滑下

slideUp([s,[e],[fn]])

通过高度变化（向上减小）来动态地隐藏所有匹配的元素，在隐藏完成后可选地触发一个回调函数。

$("p").slideUp("slow");用600毫秒缓慢的将段落滑上

slideToggle([s],[e],[fn])

通过高度变化来切换所有匹配元素的可见性，并在切换完成后可选地触发一个回调函数。

$("p").slideToggle("slow");用600毫秒缓慢的将段落滑上或滑下

fadeIn([s],[e],[fn])

通过不透明度的变化来实现所有匹配元素的淡入效果，并在动画完成后可选地触发一个回调函数。$("p").fadeIn("slow");用600毫秒缓慢的将段落淡入

fadeOut([s],[e],[fn])

通过不透明度的变化来实现所有匹配元素的淡出效果，并在动画完成后可选地触发一个回调函数。

$("p").fadeOut("slow");用600毫秒缓慢的将段落淡出

fadeTo([[s],o,[e],[fn]])

把所有匹配元素的不透明度以渐进方式调整到指定的不透明度，并在动画完成后可选地触发一个回调函数。

$("p").fadeTo("slow", 0.66);用600毫秒缓慢的将段落的透明度调整到0.66，大约2/3的可见度

fadeToggle([s,[e],[fn]])

通过不透明度的变化来开关所有匹配元素的淡入和淡出效果，并在动画完成后可选地触发一个回调函数。

$("p").fadeToggle("slow");用600毫秒缓慢的将段落淡入/出

animate(p,[s],[e],[fn])1.8*

用于创建自定义动画的函数。