js学习笔记

 JavaScript库

仓库：可以把很多东西放到这个仓库里面。找东西只需要到仓库里面查找就可以了。

JavaScript仓库

即library，是一个封装好的特定的集合（函数和方法）。从封装一大堆函数的角度理解库，就是在这个库中，封装了很多预先设定好的函数在里面，比如动画animate，hide，show，比如获取元素等。也就是说，就是一个JS文件，里面对我们原生js代码进行了封装，存放到里面。这样我们可以快速高效的利用这些分装好的功能。

常见的JavaScript库

jQuery，prototype，YUI，DOJO,ExtJS,移动端的zepto等

jQuery概念

jQuery是一个简洁的JavaScript库，其设计的宗旨“write less,do more”即倡导写更少的代码，做更多的事情

j就是JavaScript；query查询；意思就是查询js，把js中的DOM操作做了封装，我们可以快速的查询使用里面的功能

优点：1，轻量级。核心文件才几十kb，不会影响页面加载速度。2.跨浏览器兼容。基本兼容了现在主流的浏览器。3，链式编程，隐形迭代4，对事件、样式、动画支持、大大简化了DOM的操作5，支持插件扩展开发。有着丰富的第三方插件，例如：树形菜单、日期控件、轮播图等6，免费开源

jQuery的入口函数

$(function(){

    ...//此处是页面DOM加载完成的入口

    }）；

$(document）.ready (function)(){

    ...//此处是页面DOM加载完成的入口

    }）；

1.等着DOM结构渲染完毕即可执行内部代码，不必等到所有外部资源加载完成，jQuery帮我们完成了封装。

2.相当于js中的DOMcontentloaded。

3.不同于原生js中的load事件是等页面文档、外部的js文件、css文件、图片加载完毕才执行内部代码

4.更推荐使用第一种方式

jQuery的顶级对象$

1.$是jQuery的别称，在代码中可以使用jQuery代替$，但一般方便，通常直接使用$。

2.$是jQuery的顶级对象，相当于原生的JavaScript中的window。把元素利用$包装成jQuery对象，就可以调用jQuery的方法。

jQuery对象和DOM对象

1.用原生JS获取对象就是DOM对象

2.jQuery方法获取的元素就是jQuery对象

3.jQuery的对象本质是：利用$对DOM对象包装后产生的对象（伪数组形式储存）

 DOM对象与jQuery之间是可以相互转换的

因为原生js比jQuery更大，原生的一些属性和方法jQuery没有给我们封装，想要使用这些属性和方法需要把jQuery对象转换为DOM对象才能使用            

1.DOM对象转化为jQuery对象：$(DOM对象)

2.jQuery对象转换为DOM对象两种方式

$('div')[index]      index是索引号

$('div')，get（index)   index是索引号

jQuery常用API

jQuery选择器

1.1jQuery基础选择器

原生JS获取元素方式很多，很杂而且兼容性情况不一致，因此jQuery给我们做了封装，使获取元素统一标准

$("选择器")//里面选择器直接写css选择器即可，但要加引号

 1.2jQuery层级选择器

 jQuery设置样式

$('div').css(‘属性’，‘值’)

1.3隐式迭代

遍历内部DOM元素（伪数组形式存储）的过程就叫做隐式迭代

简单理解：给匹配到的所有元素进行循环遍历，执行相应的方法，而不用我们再进行循环，简化我们的操作，方便我们调用。

1.4jQuery筛选选择器

 1.5jQuery筛选方法

重点记住：parent（）children（）find（）siblings（）eq（）

1.6jQuery的排他思想

想要多选一的效果，排他思想：当前元素设置样式，其余的兄弟元素清除样式。

2.jQuery样式操作

2.1操作css的方法

jQuery可以使用css方法来修改简单元素样式：也可以操作类，修改多个样式

（1）参数只写属性名，则是返回属性值

$(this).css("color");

(2).参数市属性名，属性值，逗号分隔，是设置一组样式，属性必须加引号，值如果是数字就可以不用跟单位和引号

$(this).css("color","red");