首先要添加jquery库

<script type="text/javascript" src="jquery.js"></script>

选择器：

基本：

$("*"): 所有元素
$("#lastname"): id="lastname" 的元素
$(".intro"): 所有 class="intro" 的元素
$("p"): 所有<p>元素
$(".intro.demo"): 所有 class="intro"且 class="demo" 的元素
$("th,td,.intro"): 所有带有匹配选择的元素

层级：

$("parent > child"): 这个子元素组合器(E > F)和(E F)都作为后代组合，但是他们有所不同，更具体的是(E > F)它只会选择第一级的后代。
$("ancestor descendant"): 即(E F)一个元素的后代可能是该元素的一个孩子，孙子，曾孙等。
$( "prev + next" ): 用于筛选紧跟在 "PRev" 后面的元素的选择器。其中重要的一点既要考虑下一个相邻兄弟选择器（ prev + next ）和一般兄弟选择器（prev ~ siblings ）所选择到的元素，必须在同一个父元素下。
$( "prev ~ siblings" ): 一个选择器来过滤第一选择器以后的兄弟元素,跟随其的所有同级元素。

基本筛选：

$("p:First"): 第一个 <p> 元素
$("p:last"): 最后一个 <p> 元素
$("tr:even"): 所有偶数

内容筛选：

$(":contains('W3School')"): 包含指定字符串的所有元素
$(":empty")无子（元素）: 节点的所有元素
$(":has(selector)"): 如果表达式 $('div:has(p)') 匹配一个 <div>，那么应有一个<p>存在于 <div>后代元素中的任何地方，不是直接的子元素也可以。

可见性筛选：

$("p:hidden"): 所有隐藏的<p>元素
$("table:visible"): 所有可见的表格

属性选择器：

$("[href]"): 所有带有 href 属性的元素
$("[href='#']"): 所有 href 属性的值等于 "#" 的元素
$("[href!='#']"): 所有 href 属性的值不等于 "#" 的元素
$("[href$='.jpg']"): 所有 href 属性的值包含以 ".jpg" 结尾的元素
$("input[name~='man']"): 查找所有属性中含有 'man' 这个单词的文本框，并且修改其文本值
$("input[name$='letter']"): 查找所有的属性名称以“letter”的结束，并把他们的文字输入
$("input[name^='letter']"): 选择指定属性是以给定字符串（letter）开始的元素
$("input[id][name$='man']"): 查找那些有 id 属性，并且 name 属性以 man 结尾的输入框

表单：

$(":input"): 所有 <input> 元素
$(":text"): 所有 type="text" 的 <input> 元素
$(":password"): 所有 type="password" 的 <input> 元素
$(":radio"): 所有 type="radio" 的 <input> 元素
$(":checkbox"): 所有 type="checkbox" 的 <input> 元素
$(":submit"): 所有 type="submit" 的 <input> 元素
$(":reset"): 所有 type="reset" 的 <input> 元素
$(":button"): 选择所有按钮元素和 type="button" 的 <input> 元素
$(":image"): 所有 type="image" 的 <input> 元素
$(":file"): 所有 type="file" 的 <input> 元素
$(":enabled"): 所有可用的 <input>元素（未被禁用的元素）
$(":disabled"): 所有禁用的 <input>元素
$(":selected"): 所有被选取的 <input>元素
$(":checked"): 所有被选中的 <input>元素（被勾选的元素）
$(":focus"): 选择当前获取焦点的元素

事件：

浏览器事件

• .resize()
  当浏览器window的尺寸改变时，window元素上绑定的resize事件将被触发
  当窗口大小改变时（或改变后），查看窗口的宽度：

  $(window).resize(function() {
      $('body').prepend('<div>' + $(window).width() + '</div>');
  });

• scroll()

  @H_543_406@

  当用户在元素内执行了滚动操作，就会在这个元素上触发scroll事件。

  $(window).scroll(function () {
      $("span").css("display", "inline").fadeOut("slow");
  });

事件绑定

• .on()
  方法是将事件处理程序绑定到文档（document）的首选方法. .on()方法事件处理程序到当前选定的jQuery
  对象中的元素。
  在jQuery1.7中，.on()方法 提供绑定事件处理的所有功能。为了帮助从旧的jQuery事件方法转换过来，查
  看.bind(), .delegate(), 和 .live().要删除的.on()绑定的事件，请参阅.off()。要绑定一个事件，并
  且只运行一次，然后删除自己， 请参阅.one(). (on()取代bind()和delegate())

  Example: 通过使用 .stopPropagation()，防止提交事件的冒泡行为，但是并不禁止提交行为。

  $("form").on("submit", function(event) {
    event.stopPropagation();
  });

• .off() off()方法移除用.on()绑定的事件处理程序。

• .bind() 向匹配元素附加一个或更多事件处理器

  $('#foo').bind('click', function() { alert('User clicked on "foo."');});

• .trigger()
  trigger()函数用于**在每个匹配元素上触发指定类型的事件。
  此外，你还可以在触发事件时为事件处理函数传入额外的参数。
  使用该函数可以手动触发执行元素上绑定的事件处理函数，也会触发执行该元素的默认行为。
  以表单元素<form>为例，使用trigger("submit")可以触发该表单绑定的submit事件，也会执行表单
  submit事件的默认行为——表单提交操作。

表单事件

• .blur() 一个元素失去焦点将触发blur事件。
  起初，这个事件仅适用于表单元素，如元素<input>。在最新的浏览器中，这个事件适用范围已经扩大到
  包括所有元素类型。一个元素可以通过键盘命令失去焦点，比如tab键，或用鼠标点击网页上的其他地方。

  $('#target').blur(function() { alert('Handler for .blur() called.');});

• .change()触发、或将函数绑定到指定元素的 change事件
  一个元素的值改变的时候将触发change事件。此事件仅限用于<input>元素，<textarea>和<select>
  元素。对于下拉选择框，复选框和单选按钮，当用户用鼠标作出选择，该事件立即触发，但对于其他类型
  的input元素，该事件触发将推迟，直到元素失去焦点才会触点。

  $('.target').change(function() {
      alert('Handler for .change() called.');
  });

• .click()触发、或将函数绑定到指定元素的 click 事件

• .dblclick()触发、或将函数绑定到指定元素的 double click 事件一个元素被双击时将触发 dblclick事件。任何HTML元素都可以收到此事件。

  $('#target').dblclick(function() {
      alert('Handler for .dblclick() called.');
  });