JQuery总结复习

jQuery的优点

  1 轻量级####  2 强大的选择器
  3 出色的DOM操作封装
  4 可靠的事件处理机制
  5 完善的Ajax
  6 不污染顶级变量
  7 出色的浏览器兼容性
  8 链式操作方式
  9 隐式迭代
  10 行为层与结构层的分离
  11 丰富的插件支持
  12 完善的文档
  13 开源

起步准备

$("#foo")和jQuery("#foo")是等价的
$.ajax 和 jQuery.ajax 是等价的

- $(function(){ }) 相当与 js 当中的 window.onload
- 都是在页面完成之后立刻执行的，但是window.onload 只能写一个而$(function(){})可以写多个
- 不简写的时候是$(document).ready(function(){})
- 都不需要自调用，页面加载完毕后自动执行

链式操作风格

  $(".level1>a").click(function(){
          $(this).addClass("current") //给当前元素添加"current"样式
          .next().show(); //下一个元素显示
          .parent().siblings()//父元素的同辈元素
          .children("a") //子元素<a>
          .removeClass("current")//移出"current"样式
          .next().hide();//他们的下一个元素隐藏
        return false;
        })

jQuery对象转换为dom对象

- 1 jQuery对象是一个类似数组，可以通过[index]的方法得到相应的DOM对象

 var $cr = $("#cr"); -- jQuery对象
 var cr  = $cr.[0]; -- DOM对象

- 2 另一种方法是jQuery本身提供的，通过get(index)方法的相应的DOM对象

  var $cr = $("#cr"); -- jQuery对象
  var cr  = $cr.get(0); -- DOM对象

DOM对象转成jQuery对象：

- 对于一个DOM对象只需要用$()把DOM对象包装起来就可以获得一个jQUery对象了

  var cr = document.getElementById("cr"); -- DOM对象
  var $cr = $(cr); -- jQuery对象

解决冲突

- 如果js库和jQuery库发生冲突，我们可以在任何时候调用： jQuery.noCOnflict()函数来解决

    var $jaovo = jQuery.noConflict();
        $jaovo(function(){
          $jaovo("p").click(function(){
            alert($jaovo(this).text());
          });
        });