jQuery入门教程

本文版权归做者和博客园共有，欢迎转载，但未经做者赞成必须保留此段声明，且在文章页面明显位置给出原文链接，博客地址为http://www.cnblogs.com/jasonnode/ 。网站上有对应每一小节的在线练习你们能够去试试。

介绍
------

欢迎学习jQuery。jQuery是一个JavaScript库，现在已发展成为集JavaScript、CSS、DOM、Ajax于一体的框架体系。要想用jQuery，首先要安装上jQuery的开发环境。

首先下载jQuery
----------
在jQuery官网：`<a href="http://jquery.com">http://jquery.com</a>`中下载最新版本的jQuery。

引入jQuery
--------

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>

 

您是否很疑惑为何咱们没有在 script 标签中使用 type="text/javascript" ？ 在 HTML5 中，没必要那样作了。JavaScript 是 HTML5 以及全部现代浏览器中的默认脚本语言！

jQuery语法
--------

jQuery 语法是为HTML元素的选取编制的，能够对元素执行某些操做。

基础语法是：`$(selector).action()`

美圆符号定义jQuery
选择符(selector)"查询"和"查找"HTML元素
jQuery的action()执行对元素的操做

示例：
---

$(this).hide()- 隐藏当前元素
$("p").hide()- 隐藏全部段落
$(".test").hide()- 隐藏全部class = "test" 的全部元素
$("#test").hide()- 隐藏全部 id = "test" 的元素

jQuery 使用的语法是 XPath 与 CSS 选择器语法的组合，接下来的第二章咱们将讲解更多的选择器的知识。

传说中的hello world
---------------

在学习新的编程知识的时候，每每都从一个“hello world”例子开始，那么学习jQuery，咱们也从先从一个“hello world”开始。

<title>传说中的hello world</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function (){
alert("hello world!");
});
</script>

$(document).ready(function (){
//代码段
});

能够简化成：

$(function (){
//代码段
});

jQuery的优点：
----------

1.轻量级。jQuery很是轻巧，最新的jQuery版本压缩后，大小保持在80k左右。

2.强大的选择器。jQuery容许使用从CSS1到CSS3几乎全部的选择器，以及jQuery本身的高级而复杂的选择器。甚至你能够编写属于本身的选择器。咱们将在第二章中详细讲解。

3.出色的DOM操做的封装；jQuery封装了大量经常使用的DOM操做，让你能轻松地完成各类本来很是复杂的操做。第三章将重点介绍jQuery的DOM操做。

4.可靠的事件处理机制；第四章中咱们将详细讲解。

5.完善的Ajax；jQuery将全部的Ajax操做封装到一个函数$.ajax()里，使得开发者处理Ajax的时候可以专心处理业务逻辑而无需关系复杂的浏览器兼容性和XMLHttpRequest对象的建立和使用的问题。在第六章将会重点介绍。

6.出色的浏览器兼容性等等。可是jQuery2.0及后续版本将再也不支持IE6/7/8浏览器。