jQuery基础知识

jQuery简介

简介

jQuery是一个兼容多浏览器的javascript库，核心理念是write less,do more(写的更少,做的更多)。 jQuery在2006年1月由美国人John Resig在纽约的barcamp发布，吸引了来自世界各地的众多javascript高手加入，现在由Dave Methvin率领团队进行开发。如今， jQuery已经成为最流行的javascript库，在世界前10000个访问最多的网站中，有超过55%在使用jQuery 。【摘自百度百科】

使用jQuery

使用jQuery首先需要在页面中进行引用，如下：

<script type="text/javascript" src="Scripts/jquery-1.8.1.min.js"></script>

使用的代码如下：

$(document).ready(function () {
    $("#div1").html("hello world");
});

$(function () {
    $("#btnOK").bind("click", function () { 
    
    });
});

上面的代码相当于window.onload，不过跟window.onload还是有一些区别，后面会以表格的形式来展现他们的区别。在jQuery中到处可以见到$符号，这是jQuery里的一种简写，$("#btnOK")和jQuery("#btnOK")是等价的。

window.onload和$(document).ready()的区别

	window.onload	$(document).ready()
执行时间	网页所有内容加载完后执行	DOM结构加载完后就执行，效率更高
编写个数	1个	多个，多个的执行顺序取决于函数的顺序以及引用文件的顺序
是否支持简写	不支持	简写形式为：$(function(){});

DOM对象和jQuery对象转换

获取DOM对象代码如下：

//获取DOM对象
var div1 = document.getElementById("div1");
div1.innerHTML = "1111";

获取jQuery对象代码如下:

//获取jQuery对象
var div1 = $("#div1");
div1.html("1111");

jQuery对象转DOM对象

//因为ajQuery对象是一个数组对象，所以转换为DOM对象时要用索引的形式
var $div1 = $("#div1"); //jQuery对象
var div2 = $div1.get(0); //和上面一行效果一样
div1.innerHTML = "1111";

DOM对象转jQuery对象

//DOM对象转jQuery只需用$包装即可
var div1 = document.getElementById("div1");
var $div1 = $(div1); //转换为了jQuery对象
$div1.html("1111");