jQuery 是什么?

jQuery是什么 ?

jQuery是一个快速，简洁的JavaScript库，由John Resig创建于2006年，有一个很好的座右铭：少写，多做。

jQuery 简化了 HTML 文档遍历，事件处理，动画和Ajax交互快速Web开发的。

jQuery是一个JavaScript工具包，旨在简化各种任务，通过编写更少的代码。这里是重要的支持jQuery的核心功能列表：

DOM操作: jQuery 很容易地选择DOM元素，遍历和修改其内容，通过使用跨浏览器的开源选择器引擎称为Sizzle(嘶嘶声)。
事件处理: jQuery提供了一个优雅的方式来捕捉各种各样的事件，比如用户点击一个链接，而无需杂乱的HTML代码本身与事件处理程序.
AJAX 支持: jQuery 帮助采用AJAX技术，开发一个具有响应性的和功能丰富的网站.
动画: jQuery提供了大量的内置动画效果，可以在网站中使用。
轻量级: jQuery是非常轻量级的库 - 大小约19KB（精缩和gzip压缩）。
跨浏览器支持: jQuery有跨浏览器的支持，以及在IE6.0+，FF2.0+，Safari 3.0以上版本，Chrome和Opera9.0+
最新技术: jQuery的支持CSS3选择器，基本的XPath语法。

如何安装jQuery？

这是很简单的事情需要设置使用jQuery库。必须进行两个简单的步骤：

转到下载页面下载最新版本。
现在把 jquery1.8.min.js 下载文件在网站的目录，例如/jquery。

下载的文件名 jquery1.8.min.js 版本可能会有所不同。

jQuery没有要求任何特殊的安装非常类似于JavaScript，我们并不需要任何编译或建立阶段使用jQuery。

如何使用jQuery库？

现在，可以在HTML文件内容如下：包括jQuery库

<html>
<head>
<title>The jQuery Example</title>
   <script type="text/javascript" 
   src="/jquery/jquery-1.8.min.js"></script>
   <script type="text/javascript">
      // you can add our javascript code here 
   </script>   
</head>
<body>
........
</body>
</html>

如何调用jQuery库功能？

由于几乎所有的东西，我们做的时候使用jQuery读取或操纵的文档对象模型（DOM），我们需要确保我们开始添加事件等，只要DOM准备好。

如果您想要一个事件工作网页上，应该调用它里面的$(document).ready() 函数。它里面的一切都将载入尽快DOM加载之前加载页面内容。

要做到这一点，我们需要注册一个ready事件的文件如下：

$(document).ready(function() {
   // do stuff when DOM is ready
 });

调用任何jQuery库函数，使用HTML脚本标签，如下图所示：

<html>
<head>
<title>The jQuery Example</title>
   <script type="text/javascript" 
   src="/jquery/jquery-1.3.2.min.js"></script>
   
   <script type="text/javascript" language="javascript">
   // <![CDATA[
   $(document).ready(function() {
      $("div").click(function() {
        alert("Hello world!");
      });
   });
   // ]]>
   </script>

</head>
<body>
<div id="newdiv">
Click on this to see a dialogue box.
</div>
</body>
</html>

如何使用自定义脚本？

这是更好地在自定义的JavaScript文件：custom.js写我们的自定义代码，具体如下：

/* Filename: custom.js */
$(document).ready(function() {
  $("div").click(function() {
	alert("Hello world!");
  });
});

现在，我们可以在HTML文件如下包括custom.js文件：

<html>
<head>
<title>The jQuery Example</title>
   <script type="text/javascript" 
   src="/jquery/jquery-1.8.2.min.js"></script>
   <script type="text/javascript" 
   src="/jquery/custom.js"></script>
</head>
<body>
<div id="newdiv">
Click on this to see a dialogue box.
</div>
</body>
</html>

使用多个库：

可以使用多个库都在一起，要彼此没有冲突。例如，可以用 jQuery 和 MooTool javascript库在一起。

可以查看jQuery noConflict方法的更多细节。

下一步是什么？

不要担心太多，如果不明白上面的例子。他们很快在随后的章节学习和熟悉。

下一章将试图掩盖一些基本的概念都来自传统的JavaScript。