初识JQuery

jQuery是一个JavaScript程序库。

1.如何引入jQuery包

• a. 引入本地的jQuery
• b. 引入在线的库文件

<script type=“text/javascript” src=“jquery.js”></script>
写第一个jQuery案例
<script type=“text/javascript” src=“”></script>
<script type=“text/javascript”>
	$(function(){
		alert(“jQuery 你好!”);
	});
</script>

在jQuery库中，$是jQuery的别名，$()等效于就jQuery().

2. $(function(){});

• a. $是jQuery别名。如$()也可jQuery()这样写,相当于页面初始化函数，当页面加载完毕，会执行jQuery()。
• b. window.onload

$(window).load(function(){})

类似于

$(function(){}) == $(document).ready(function(){})

 ready要比onload先执行

window.onload = function () {
alert('onload');
};

$(document).ready(function () {
alert('ready'); 
});

3.jQuery对象和DOM对象

1. JavaScript中的getElementsByTagName或者getElementById来获取元素节点。像这样得到的DOM元素就是DOM对象。DOM对象可以使用JavaScript中的方法

var domObj = document.getElementById(“id”); //获得dom对象
var objHtml = domObj.innerHTML;  //使用js中的属性--innerHTML

2. jQuery对象就是通过jQuery包装DOM对象后产生的对象。

   jQuery对象是jQuery独有的。如果一个对象是jQuery对象，那么就可以使用jQuery里的方法。

$(“#foo”).html();//获取id为foo的元素内的html代码，html()是jQuery中的方法
//等同于
document.getElementById(“foo”).innerHTML

3. DOM对象转成jQuery对象

对于一个DOM对象，只需要用$()把DOM对象包装起来，就可以获得一个jQuery对象了。方式为$（DOM对象）。

var foo = document.getElementById(“foo”);
var $foo = $(foo);

4. jQuery对象转成DOM对象

jQuery对象不能使用DOM中的方法，但如果对jQuery对象所提供的方法不熟悉，或者jQuery没有封装想要的方法，不得不使用DOM对象的时候，有以下两种处理方法。

jQuery提供了两种方法将一个jQuery对象转换成DOM对象，即[index]和get（index）。

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

var $foo = $(“#foo”);
var foo = $foo[0];

• （2）另一种方法是jQuery本身提供的，通过get(index)方法得到相应的DOM对象。

var $foo = $(“#foo”);
var foo = $foo.get(0);

4.jQuery功能(API)

1>选择器

2>筛选（过滤器）

3>CSS

4>事件

5>效果

6>AJax