2.3.3 jQuery

jQuery是一个JavaScript代码库（library）。它既非ECMAScript标准库（standard library）的一部分，也非浏览器对JavaScript的扩展（如DOM API那样）。但它十分重要，有必要做一介绍。

下面的例子用jQuery实现了与上面相同的功能：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>你好</title>
  </head>
  <body>
    <button id="btn1">点我</button>
    <script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script>
      $('#btn1').click(function() {
        $('body').html('<h1>你好，JavaScript！</h1>');
      });
    </script>
  </body>
</html>

这行代码引入了jQuery库：

<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>

这段代码对button的click事件注册了一个回调函数：

<script>
  $('#btn1').click(function() {
    $('body').html('<h1>你好，JavaScript！</h1>');
  });
</script>

jQuery有几个重要功能。首先就是简单、灵活的HTML元素选择功能。如果读者对CSS选择器（selector）有一些了解就会发现：jQuery可以使用相同的选择器来选择HTML元素。例如，通过ID选择对象

$('#btn1')

或者通过元素名称选择对象

$('body')

其次就是提供简单、一致的编程接口。例如上面用来注册事件的click方法，以及用来设置内容文本的html方法，都比对应的标准API要简单。

“一致性”在此值得一提：我们希望相同的HTML文档在不同的浏览器里表现一致——内容、排版和行为都一样。但实际上这种一致性不是轻易可得的，尤其是在早些年Web标准（如HTML，CSS和ECMAScript的标准）还不完善的时候。虽然现在标准日臻完善，但各浏览器厂商在遵循/理解标准方面仍有差异。jQuery提供的编程接口“抹平”了这种差异性，使我们至少在JavaScript编程方面可以比较容易地做到跨浏览器一致。

results matching ""

    No results matching ""