jQuery 简介/安装



  • 什么是jQuery?

    jQuery是一个轻量级的“少写,做多”的JavaScript库。
    jQuery的目的是让您在网站上使用JavaScript变得更加容易。
    jQuery需要执行许多需要多行JavaScript代码的常见任务,并将它们包装到可以使用一行代码调用的方法中。
    jQuery还简化了许多来自JavaScript的复杂事物,比如AJAX调用和DOM操作。
    jQuery库包含以下功能:
    • HTML/DOM操作
    • CSS 操作
    • HTML事件方法
    • 效果和动画
    • AJAX
    • Utilities
  • 为什么选择jQuery?

    还有很多其他的JavaScript框架,但jQuery似乎是最受欢迎的,也是最具扩展性的。
    Web上许多大公司都使用jQuery,例如:
    • Google
    • Microsoft
    • IBM
    • Netflix
    jQuery会在所有浏览器中运行吗?
    jQuery团队了解所有关于跨浏览器的问题,他们已将这些知识写入jQuery库。 jQuery将在所有主流浏览器中运行完全相同。
  • 向您的页面添加jQuery库

    jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery 函数。
    可以通过下面的标记把 jQuery 添加到网页中:
        
           <head>
           <script type="text/javascript" src="jquery.js"></script>
           </head>
    
    请注意,<script> 标签应该位于页面的 <head> 部分。
  • 基础 jQuery 实例

    下面的例子演示了 jQuery 的 hide() 函数,隐藏了 HTML 文档中所有的 <p> 元素。
         
                <html>
                   <head>
                     <script type="text/javascript" src="jquery.js"></script>
                     <script type="text/javascript">
                       $(document).ready(function(){
                          $("button").click(function(){
                             $("p").hide();
                          });
                       });
                     </script>
                   </head>
                   
                   <body>
                     <h2>This is a heading</h2>
                     <p>This is a paragraph.</p>
                     <p>This is another paragraph.</p>
                     <button type="button">点击我</button>
                   </body>
                </html>
    
  • 下载 jQuery

    共有两个版本的 jQuery 可供下载:一份是精简过的,另一份是未压缩的(供调试或阅读)。
    这两个版本都可从 jQuery.com 下载。
  • 库的替代

    Bootstrap 和 百度 对 jQuery 的支持都很好。
    如果您不愿意在自己的计算机上存放 jQuery 库,那么可以从 Bootstrap 或 百度 加载 CDN jQuery 核心文件。
    使用 Bootstrap 的 CDN
     
           <head>
           //此版本是1.11.2,当然你可以使用更高的版本,从2.0版本以上的是不支持ie6-8的
           <script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
           </head>
    
    使用 百度 的 CDN
     
           <head>
           //此版本是1.11.1,当然你可以使用更高的版本,从2.0版本以上的是不支持ie6-8的
           <script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
           </head>
    
    提示:使用Bootstrap或百度的 jQuery,有一个很大的优势:
    许多用户在访问其他站点时,已经从Bootstrap或百度加载过 jQuery。所有结果是,当他们访问您的站点时,会从缓存中加载 jQuery,这样可以减少加载时间。同时,大多数 CDN 都可以确保当用户向其请求文件时,会从离用户最近的服务器上返回响应,这样也可以提高加载速度。