// 条件加载Jquery,如果CDN没有下载到Jquery，则从本地读取。
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script>window.jQuery || document.write('<script src="/public/js/jquery.js"><\/script>')</script>

// Jquery和$的关系
window.jQuery = window.$ = jQuery; //$其实就是Jquery的一个shortcut

$(document).ready(function(){});
// 可直接写成
$(function(){});
/*注：不同于js中的onload事件，onload需要页面内容加载完毕（图片等），
而ready只要页面html代码下载完毕即触发。与$(fn)等价 */

// 获取元素id的方法有
var id = $('#someAnchor').attr('id');
var id = $('#someAnchor')[0].id;
var id = $('#someAnchor').get(0).id;

// 使用链式写法 可提高性能
$("#mydiv").hide();
$("#mydiv").css("padding-left", "50px");
// 可写成
$("#mydiv").hide().css("padding-left", "50px");

// 适当的定义变量
$("#mydiv").hide();
$("#mydiv").show();
// 可写成
var $myMxria = $("#mydiv").hide();
$myMxria.show();


// 循环一堆标签并添加到数组中的方法
var oCaseLi=$('.case-left>ul li');
var aCaseLi=[];
$.each(oCaseLi,function(i,n){
  aCaseLi.push(n);
});

  $('div,span,p.myClass') //联合所有匹配的选择器
  $('#main > *') //子选择器，选择parent的所有子节点
  $('.div').eq(1);
  $('.div').get()： //通过jQuery对象获取一个对应的DOM元素。
  $('.div p span');
  $('.div').find('p')[2];
  $('label + input') //临选择器，选择prev的下一个临节点
  $('#prev ~ div') //同胞选择器，选择prev的所有同胞节点
  //基本过滤选择器
  $('tr:first') //匹配第一个选择的元素
  $('tr:last') //匹配最后一个选择的元素
  $('input:not(:checked) + span')//从原元素集合中过滤掉匹配selector的所有元素（这里有是一个临选择器）
  $('tr:even') //匹配集合中偶数位置的所有元素(从0开始)
  $('tr:odd') //匹配集合中奇数位置的所有元素(从0开始)
  $('td:eq(2)') //匹配集合中指定位置的元素(从0开始)
  $('td:gt(4)') //匹配集合中指定位置之后的所有元素(从0开始)
  $('td:gl(4)') //匹配集合中指定位置之前的所有元素(从0开始)
  $(':header') //匹配所有标题
  $('div:animated') //匹配所有正在运行动画的所有元素
  //内容过滤选择器
  $('div:contains("John")') //匹配含有指定文本的所有元素
  $('td:empty') //匹配所有空元素(只含有文本的元素不算空元素)
  $('div:has(p)') //从原元素集合中再次匹配所有至少含有一个selector的所有元素
  $('td:parent') //匹配所有不为空的元素(含有文本的元素也算)
  $('div:hidden') //匹配所有隐藏的元素，也包括表单的隐藏域
  $('div:visible') //匹配所有可见的元素
  //属性过滤选择器
  $('div[id]') //匹配所有具有指定属性的元素
  $('input[name="newsletter"]') //匹配所有具有指定属性值的元素
  $('input[name!="newsletter"]') //匹配所有不具有指定属性值的元素
  $('input[name^="news"]') //匹配所有指定属性值以value开头的元素
  $('input[name$="letter"]') //匹配所有指定属性值以value结尾的元素
  $('input[name*="man"]') //匹配所有指定属性值含有value字符的元素
  $('input[id][name$="man"]') //匹配同时符合多个选择器的所有元素
  //子元素过滤选择器
  $('ul li:nth-child(2)'),
  $('ul li:nth-child(odd)'), //匹配父元素的第n个子元素
  $('ul li:nth-child(3n + 1)')
  $('div span:first-child') //匹配父元素的第1个子元素
  $('div span:last-child') //匹配父元素的最后1个子元素
  $('div button:only-child') //匹配父元素的唯一1个子元素
  //表单元素选择器
  $(':input') //匹配所有的表单输入元素，包括所有类型的input, textarea, select 和 button
  $(':text') //匹配所有类型为text的input元素
  $(':password') //匹配所有类型为password的input元素
  $(':radio') //匹配所有类型为radio的input元素
  $(':checkbox') //匹配所有类型为checkbox的input元素
  $(':submit') //匹配所有类型为submit的input元素
  $(':image') //匹配所有类型为image的input元素
  $(':reset') //匹配所有类型为reset的input元素
  $(':button') //匹配所有类型为button的input元素
  $(':file') //匹配所有类型为file的input元素
  $(':hidden') //匹配所有类型为hidden的input元素或表单的隐藏域
  //表单元素过滤选择器
  $(':enabled') //匹配所有可操作的表单元素
  $(':disabled') //匹配所有不可操作的表单元素
  $(':checked') //匹配所有已点选的元素
  $('select option:selected') //匹配所有已选择的元素
  end() //结束当前的操作，回到当前操作的前一个操作
  // 找到所有div元素其中的span元素集合，然后返回p元素集合，添加css属性
  $('div').find('p').end().css('color', 'red');
  next() //取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。
  nextAll() //取得一个包含匹配的元素集合中每一个元素所有的后面同辈元素的元素集合
  parent() //取得一个包含着所有匹配元素的唯一父元素的元素集合。
  parents() //取得一个包含着所有匹配元素的唯一祖先元素的元素集合（不包含根元素）。
  prev() //取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。
  prevAll() //取得一个包含匹配的元素集合中每一个元素的之前所有同辈元素的元素集合。
  siblings() //取得一个包含匹配的元素集合中每一个元素的所有同辈元素的元素集合。
  andSelf() //将前一个匹配的元素集合添加到当前的集合中
  filter() //返回与指定表达式匹配的元素集合，可以使用','号分割多个expr，用于实现多个条件筛选
  filter() //利用一个特殊的函数来作为筛选条件移除集合中不匹配的元素。
  is() //用一个表达式来检查当前选择的元素集合，如果其中至少有一个元素符合这个给定的
  // 表达式就返回true。
  map() //将jQuery对象中的一组元素利用callback方法转换其值，然后添加到一个jQuery数组中。
  not() //从匹配的元素集合中删除与指定的表达式匹配的元素。
  slice( start, [end] ) //从匹配元素集合中取得一个子集，和内建的数组的slice方法相同。
  add() //把与表达式匹配的元素添加到jQuery对象中。
  children() //取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。可选的过滤器
  // 将使这个方法只匹配符合的元素(只包括元素节点，不包括文本节点)。
  contents() //取得一个包含匹配的元素集合中每一个元素的所有子孙节点的集合(只包括元素节点，不
  // 包括文本节点)，如果元素为iframe，则取得其中的文档元素

  $("#msg").html(); //获取或赋值html
  $("#msg").text(); //获取赋值文本
  $("#msg").attr(); //获取赋值元素属性
  $("#msg").removeAttr('class') //删除元素class属性及值
  $("#msg").height();//获取赋值高度
  $("#msg").width();//获取赋值宽度,方法用于获得元素宽度
  $("#msg").innerWidth()//方法用于获得包括内边界（padding）的元素宽度
  $("#msg").outerWidth()//方法用于获得包括内边界(padding)和边框(border)的元素宽度
  $("#msg").outerWidth(true)//方法用于获得包括内边界(padding)和边框(border)以及(margin)的元素宽度
  $("input").val(); //获取赋值输入框值
  $('#msg').after(content); //在匹配元素后面添加内容
  $('#msg').append(content); //将content作为元素的内容插入到该元素的后面
  $('#msg').appendTo(content); //在content后接元素
  $('#msg').before(content); //与after方法相反
  $('#msg').clone('布尔表达式') //当布尔表达式为真时，克隆元素（无参时，当作true处理）
  $('#msg').empty() //将该元素的内容设置为空
  $('#msg').insertAfter(content); //将该元素插入到content之后
  $('#msg').insertBefore(content); //将该元素插入到content之前
  $('#msg').prepend(content); //将content作为该元素的一部分，放到该元素的最前面
  $('#msg').prependTo(content); //将该元素作为content的一部分，放content的最前面
  $('#msg').remove(); //删除所有的指定元素
  $('#msg').remove('exp'); //删除所有含有exp的元素
  $('#msg').wrap('html'); //用html来包围该元素
  $('#msg').wrap(element); //用element来包围该元素
  offset() //取得匹配的第一个元素相对于当前可视窗口的位置。返回的对象有2个属性，
  //top和left，属性值为整数。这个函数只能用于可见元素。
  // 操作元素的样式 :一个参数为选择，两个参数为赋值
  $("#msg").css("background");
  $("#msg").css({ color: "red", background: "blue" });//以名值对的形式设定样式
  $("#msg").addClass("active"); $("#msg").removeClass("active");//删除增加class
  $("#msg").toggleClass("active");//存在删除，不存在添加
  // 例：
  //每次点击时轮换添加和删除名为active的class。
  $("p").click(function(){$(this).toggleClass("selected");});

  hover(fn1,fn2);
  blur() //元素失去焦点 a, input, textarea, button, select, label, map, area
  change() //用户改变域的内容 input, textarea, select
  click() //鼠标点击某个对象 几乎所有元素
  dblclick() //鼠标双击某个对象 几乎所有元素
  error() //当加载文档或图像时发生某个错误 window, img
  focus() //元素获得焦点 a, input, textarea, button, select, label, map, area
  keydown() //某个键盘的键被按下 几乎所有元素
  keypress() //某个键盘的键被按下或按住 几乎所有元素
  keyup() //某个键盘的键被松开 几乎所有元素
  load(fn) //某个页面或图像被完成加载 window, img
  mousedown(fn) //某个鼠标按键被按下 几乎所有元素
  mousemove(fn) //鼠标被移动 几乎所有元素
  mouseout(fn) //鼠标从某元素移开 几乎所有元素
  mouseover(fn) //鼠标被移到某元素之上 几乎所有元素
  mouseup(fn) //某个鼠标按键被松开 几乎所有元素
  resize(fn) //窗口或框架被调整尺寸 window, iframe, frame
  scroll(fn) //滚动文档的可视部分时 window
  select() //文本被选定 document, input, textarea
  submit() //提交按钮被点击 form
  unload(fn) //用户退出页面 window
  //触发所有p元素的click事件
  $("p").trigger("click");
  // 事件的绑定与反绑定
  $("p").bind("click", function(){alert($(this).text());}); //为每个p元素添加单击事件
  $("p").unbind(); //删除所有p元素上的所有事件
  $("p").unbind("click") //删除所有p元素上的单击事件

  show(),hide();//里面可设置速度speed
  fadeIn( speed, [callback] ) //通过不透明度的变化来实现所有匹配元素的淡入效果，并在动画完成后可选地触
  // 发一个回调函数。 这个动画只调整元素的不透明度，也就是说所有匹配的元素的
  // 高度和宽度不会发生变化。
  fadeOut( speed, [callback] ) //通过不透明度的变化来实现所有匹配元素的淡出效果，并在动画完成后可选地触
  // 发一个回调函数。 这个动画只调整元素的不透明度，也就是说所有匹配的元素的
  // 高度和宽度不会发生变化。
  fadeTo( speed, opacity, [callback] ) //把所有匹配元素的不透明度以渐进方式调整到指定的不透明度，并在动画完成
  // 后可选地触发一个回调函数。 这个动画只调整元素的不透明度，也就是说所
  // 有匹配的元素的高度和宽度不会发生变化。
  stop( ) //停止所有匹配元素当前正在运行的动画。如果有动画处于队列当中，他们就会立即开始。
  queue( ) //取得第一个匹配元素的动画序列的引用(返回一个内容为函数的数组)
  queue() //在每一个匹配元素的事件序列的末尾添加一个可执行函数，作为此元素的事件函数
  queue( queue ) //以一个新的动画序列代替所有匹配元素的原动画序列
  dequeue( ) //执行并移除动画序列前端的动画
  animate( params, [duration], [easing], [callback] ) //用于创建自定义动画的函数。
  animate( params, options ) //创建自定义动画的另一个方法。作用同上。
  其中toggle()和slidetoggle()//方法提供了状态切换功能。
  如toggle()方法包括了hide()和show()方法。
  slideToggle()方法包括了slideDown()和slideUp方法。

  load( url, [data], [callback] ) //装入一个远程HTML内容到一个DOM结点。
  $('#feeds').load('feeds.html'); //将feeds.html文件载入到id为feeds的div中
  $('#feeds').load('feeds.php', {limit: 25}, function(){
  alert('The last 25 entries in the feed have been loaded');
  });
  jQuery.get( url, [data], [callback] ) //使用GET请求一个页面。
  $.get('test.cgi', { name: 'John', time: '2pm' }, function(data){
  alert('Data Loaded: ' + data);
  });
  jQuery.getJSON( url, [data], [callback] ) //使用GET请求JSON数据。
  $.getJSON('test.js', { name: 'John', time: '2pm' }, function(json){
  alert('JSON Data: ' + json.users[3].name);
  });
  jQuery.getScript( url, [callback] ) //使用GET请求javascript文件并执行。
  $.getScript('test.js', function(){
  alert('Script loaded and executed.');
  });
  jQuery.post( url, [data], [callback], [type] ) //使用POST请求一个页面。
  ajaxComplete()// 当一个AJAX请求结束后，执行一个函数。这是一个Ajax事件
  $('#msg').ajaxComplete(function(request, settings){
  $(this).append('<li>Request Complete.</li>');
  });
  ajaxError() //当一个AJAX请求失败后，执行一个函数。这是一个Ajax事件
  $('#msg').ajaxError(function(request, settings){
  $(this).append('<li>Error requesting page ' + settings.url + '</li>');
  });
  ajaxSend() //在一个AJAX请求发送时，执行一个函数。这是一个Ajax事件
  $('#msg').ajaxSend(function(evt, request, settings){
  $(this).append('<li<Starting request at ' + settings.url
  + '</li<');
  });
  ajaxStart() //在一个AJAX请求开始但还没有激活时，执行一个函数。这是一个Ajax事件
  //当AJAX请求开始(并还没有激活时)显示loading信息
  $('#loading').ajaxStart(function(){
  $(this).show();
  });
  ajaxStop() //当所有的AJAX都停止时，执行一个函数。这是一个Ajax事件
  //当所有AJAX请求都停止时，隐藏loading信息。
  $('#loading').ajaxStop(function(){
  $(this).hide();
  });
  ajaxSuccess() //当一个AJAX请求成功完成后，执行一个函数。这是一个Ajax事件
  //当AJAX请求成功完成时，显示信息。
  $('#msg').ajaxSuccess(function(evt, request, settings){
  $(this).append('<li>Successful Request!</li>');
  });
  jQuery.ajaxSetup( options ) //为所有的AJAX请求进行全局设置。查看$.ajax函数取得所有选项信息。
  //设置默认的全局AJAX请求选项。
  $.ajaxSetup({
  url: '/xmlhttp/',
  global: false,
  type: 'POST'
  });
  $.ajax({ data: myData });
  serialize( ) //以名称和值的方式连接一组input元素。实现了正确表单元素序列
  function showValues() {
  var str = $('form').serialize();
  $('#results').text(str);
  }
  $(':checkbox, :radio').click(showValues);
  $('select').change(showValues);
  showValues();
  serializeArray( ) //连接所有的表单和表单元素(类似于.serialize()方法)，但是返回一个JSON数据格式。
  //从form中取得一组值，显示出来
  function showValues() {
  var fields = $(':input').serializeArray();
  alert(fields);
  $('#results').empty();
  jQuery.each(fields, function(i, field){
  $('#results').append(field.value + ' ');
  });
  }
  $(':checkbox, :radio').click(showValues);
  $('select').change(showValues);
  showValues();

  $.map(array, fn)：//数组映射。把一个数组中的项目(处理转换后)保存到到另一个新数组中，并返回生成的新数组。
  如：
  var tempArr=$.map( [0,1,2], function(i){ return i + 4; });
  tempArr内容为：[4,5,6]
  var tempArr=$.map( [0,1,2], function(i){ return i > 0 ? i + 1 : null; });
  tempArr内容为：[2,3]
  $.merge(arr1,arr2)://合并两个数组并删除其中重复的项目。
  如：$.merge( [0,1,2], [2,3,4] ) //返回[0,1,2,3,4]
  $.trim(str)：//删除字符串两端的空白字符。
  如：$.trim(" hello, how are you? "); //返回"hello,how are you? "

  //扩展我们需要的功能
  $.extend({
  min: function(a, b){return a < b?a:b; },
  max: function(a, b){return a > b?a:b; }
  }); //为jquery扩展了min,max两个方法
  // 使用扩展的方法（通过'$.方法名'调用）：
  alert("a=10,b=20,max="+$.max(10,20)+",min="+$.min(10,20));