使用jQuery简化Ajax开发 Ajax开发入门

var external_links = document.getElementById('external_links');
var links = external_links.getElementsByTagName('a');
for (var i=0;i < links.length;i++) {
  var link = links.item(i);
  link.onclick = function() {
    return confirm('You are going to visit: ' + this.href);
  };
}

如果使用jQuery的话实现如下：

Listing 2. DOM scripting with jQuery

$('#external_links a').click(function() {
  return confirm('You are going to visit: ' + this.href);
});


很惊讶，是吧？使用jQuery的话，你可以很快找到关键点，并且只需要表达你需要表达的，
而不需要罗里罗嗦。不需要对这些元素进行循环，click()函数可以处理好这一切。而且你不要谢太多的操作DOM的代码，
你需要的仅仅是使用很少的字符定义你要找的那个元素。

来看一下这段代码是如何工作的，有点小技巧。首先，看到$()函数--jQuery里最有用的最强大的函数.大部分情况下,
你使用这个函数从文档中选择元素.在这个例子中,使用这个函数传递带有一些级联样式表(Cascading Style Sheets,CSS)
语法的字符串,jQuery可以很方便的找到这个元素.

如果你懂一点基本的CSS选择符的只是,我想这个语法应该看起来相当熟悉.在Listing2中,#external_links用来寻找带有id为
external_links的元素.接下来的空格表示jQuery要找到在#external_links元素内的所有的<a>元素.用口语开表达的话有点费劲--
用DOM脚本来写也挺麻烦,不过,在CSS里,没有比这个更简单的了.

$()函数返回一个包含与css选择符匹配的所有元素的一个jQuery对象. jQuery对象的概念就像是数组,但是它可能含有许多jQuery函数. 举例来说,你可以调用click函数来绑定一个click事件响应到jQuery对象中的每个元素上.