jQuery的基本知识

博前“废话”

在前面理解JavaScript的时候，写代码是感觉许多代码是可以封装起来的，但又不知道怎样去封装，于是寻找解决办法，网上寻找一番之后发现人们所说的jQuery可以解决这个问题，总结如下。

什么是jQuery?

jQuery是一个JavaScript库，它通过封装原生的JavaScript函数得到的一整套定义好的方法，jQuery已经集成了JavaScript、CSS、DOM和Ajax于一体的强大功能，并且它可以用最少的代码，完成更多复杂而困难的功能（write less,do more），这也就是我们为什么要学习jQuery的原因。

jQuery的功能和优势

jQuery作为JavaScript封装的库，其目的就是为了简化开发JavaScript。jQuery主要功能有如下几点：

1. 像CSS那样访问和操作DOM
2. 简化JavaScript代码操作
3. 修改CSS控制页面外观
4. 事件的处理更加容易
5. 更加方便使用各种动画效果
6. 使得Ajax技术更加完美
7. 可以自行扩展功能插件
8. 基于jQuer大量插件

如何使用jQuery呢？

既然jQuery是一个JavaScript封装的库，那么意味着它类似java的库对应.jar文件一样对应.js文件。我们可以在

jQuery代码使用风格

1.jQuery中有一个最重要的对象:jQuery对象，无论是页面元素的选择，还是内置的功能函数，都是使用“jQuery”起始的，jQuery设计者为了简化它，便使用“$”表示与“jQuery”相同的含义，二者可以互换。下面是元素选择或执行功能函数时的写法：

1. $(function(){});//执行一个匿名函数
2. $(‘#myId’);//进行执行的id元素选择
3. $(‘#myId’).css(‘color’,’green’);//执行功能函数

2.jQuery中的代码注释与JavaScript是一样的：“//…”:单行注释，”/…/”:多行使用。

jQuery对象是神马？

通过jQuery包装DOM对象后产生的对象，我们称之为jQuery对象，它是jQuery特有的，那么我们就可以这样写：$("#myId").html();//获取id为myId的元素内的html代码，这等价于JavaScript中的document.getElementById("myId").innerHtml();显而易见jQuery代码简介多了。根据约定：如果获取的是jQuery对象，那么在变量前加上”$”.

jQuery与DOM对象互换

很多时候我们需要jQuery与DOM对象进行互换，
1.DOM对象转成jQuery对象
要将DOM对象转化成jQuery对象，只需使用$(DOM对象)将DOM对象包装成一个jQuery对象。

类型	代码
html	<input type="text" id = "username" name="username" value="超哥">
获取Dom对象	var username = document.getElementById("username"); alert("使用DOM获取username中的值："+username.value);
转化为jQuery对象	var $username = $(username); alert("使用jQuery获取username值："+$username.val())；

2.jQuery对象转化为DOM对象
可以使用[index]和.get(index);

类型	代码
html	<input type="text" id = "username" name="username" value="超哥">
获取jQuery对象	var $username = $("#username"); alert("使用jQuery获取username值："+$username.val())；
第一种方式转化为DOM对象	var username = $username[0]; alert("使用DOM获取username中的值："+username.value);
第二种方式转化为DOM对象	var username = $username.get(0); alert("使用DOM获取username中的值："+username.value)

jQuery加载模式

JavaScript中提供了window.onload = function(){};加载。
jQuery使用`$(function(){};)加载。

	$(document).ready()	window.onload
执行时机	只需要等待网页中的DOM结构加载完毕，就能执行包裹的代码	必须等待网页全部加载完毕，然后再执行包裹的代码
执行次数	可以执行多次，都不会被上一次覆盖	只能执行一次，如果第二次，那么第一次的执行会被覆盖
简写方案	$(function(){});	无简写方案