jQuery

##总结

今天开始学习jQuery库，经过老师讲解和重写练习，发现相比源生代码，jQuery实在好用太多，而且有很多我们熟悉的方法，除了语法不同，如果掌握好相互之间的转换，对于我们做开发非常提高效率。

接下来就是尽快熟悉其使用规则，方便更快的开发。

***

技巧：

封装函数，考虑各种情况，设置默认值标记[ ]

***

- 特点：

   - 让代码简洁

    - 兼容性很好

- 版本

    - 1.X //支持IE8以前的浏览器 1.4

    - 2.X

    - 3.X //最新

    - 1.2并存 3是2的升级版

- download

    - 正常版       //源代码，看

    - min版      // 压缩版，用

-   语法

    - 全局变量

    - jquery（“#d1”）.html（） //html等价于innerHTML $

- 和源生代码互转

    - $("#d1").get() //转源生 得到一个集合 参数为下标

    - $("#d1")直接[0] //转源生

    - $(d1) //转jQuery 节点名

- 遍历

    - each（）

        - 集合

        - 里面的this代表源生对象

        - 第一个参数是下标 ，第二个参数是源生对象element

    - for循环

- 获得长度

    - length 属性

    - size（）方法

- 对像名.eq(i) //遍历时转成jQuery对象

- 选择器

    - even  以下标为标准

    - odd 以下标为标准

    - eq（index）

        - $("#d2 p:eq(0)")

    - gt(index)

    - lt(index)

- 属性

    - attr()

        - 添加多个属性用JSON，特殊属性除外

        - removeattr

    - prop（）

        - 对特殊属性设置或获取

        - removeprop

- Class

    - toggleCalss //切换

- 事件

    - click（） 回调函数

- 方法

    - html（）

    - text（）    

    - val（）

    - 不传参就是获取，传了就是设置

- 筛选

    - first（）

- 文档处理

    - append（‘<P></P>’）；

    - $(‘<p></p>’）.appendTo("#d1");

    - prepend(); 直接添加到前面

    - before

    - after

    - wrap  每一个包一个

    - wrapAll  所有的包在一起

    - wrapIner  把指定元素包在节点里面

    - unwrap    取消包裹

    - replaceWith       替换

    - empty     只删除节点内容

    - remove    删除自己

- CSS

    - $("#d1 p").css ({"color","red"}) 单个没有花括弧 //设置

    - $("#d1 p").css("backgroundColor")//获取最终样式

    - offset（） 属性.left .top 元素相对于视口的位置

    - position（） 元素相对于父级的位置

- 事件

    - 添加没有的事件

    $("#ipt").on("input",function(){

    console.log($(this).val())

    })  

    - 一个事件可以添加多个方法，DOM2，结合优点，解决兼容性问题

    - 删除事件 off（）；

- 方法的区别

    - on：一次性添加多个方法，兼容浏览器 //相比于delegate 会全部选择到

    - one：事件只有一次

    - bind： 早期版本的事件处理方法，现在被on替代了

    - live：过时，事件委托用

    - delegate ： 现在，事件委托 （“选择器”，“事件”，回调）