jQuery学习第一阶段

1.jQuery简介

jQuery历史:美国27岁约翰创建，受到好评。

 jQuery作用:

替换原生JavaScript的一个产物、简化js    DOM的复杂性和繁琐性。

跨越任何浏览器之间的兼容性，包括IE6。

jQuery初体验:

jQuery是一个封装了原生js的一些功能的类库，通过引用js类库，$(选择功能)来实现js的功能。

事件：当什么时候执行什么事

函数：封装的某个功能

事件的因果关系的格式：$(‘button’).onclick(function(){……});

jQuery书写步骤:

1.引用jQuery类库

2.新建script书写js代码

3.用jQuery方式实现代码分离

jQuery基础知识：

jQuery顶级对象jQuery对象$（window对象类似）

jQuery中注释比较重要

jQuery文件有两种，压缩迷你版主要是在运行阶段使用，编写代码使用较大的版本

ready事件：页面上标签加载完毕执行，不需要页面全部加载完成。

ready事件的三种写法：

1.jQuery(document).ready(function(){});

2.$(document).ready(function(){});

3.$(function(){});

2.jQuery提供的两个函数

1.map函数

遍历数组，返回新的数组。

map(数组对象，匿名函数(element，index){})；

$.map的源代码实现过程。

2.each函数

$.each(obj,function(){})可以遍历数组和键值对数组，不修改数组。

3.jQuery对象和DOM对象

DOM→jQuery怎么转？     （在某些情况下，因为浏览器兼容性问题，而我们不想写兼容性代码，jQuery封装了实现浏览器兼容性的函数，我们只需要使用它就可以了。即把DOM对象转换成jQuery对象，jQuery对象实际就是把DOM对象和兼容性函数封装在了一起。）

方法：var jQuery对象=$(DOM对象);

直接把DOM对象加进$()中，就把DOM对象转换为了jQuery对象了，即可以使用jQuery对象的成员了。

jQuery→DOM怎么转？     （jQuery不是万能的，一些不能实现的功能，只能转为DOM对象，使用原生JavaScript来实现）

方法1：var   DOM对象=$对象 [0];

方法2：var   DOM对象=$对象.get(0);

4.jQuery对象的常用方法

.val()方法

.val();//获取值

.val(‘内容’)；//设置值

.val()方法对应的DOM中的.value方法。

.css()方法

.css(‘样式name’,’样式’);//修改元素的css样式

.css方法对应的DOM中的.style方法，设置css的样式。

例子：.css(‘width’,’200px’);

键值对集合设置多个css样式.css({‘样式name1’:’样式’, ‘样式name2’：’样式’,……})。

.text()方法.html()方法

.text(‘内容’);//为标签之间插入内容，对应DOM中的.innnerText方法。

.html(‘内容’);//为标签之间插入内容，可以插入标签<img>等，可识别，.text不能识别标签，对应DOM中的.innnerHTML方法。