(1)、Ajax常用框架 Ext,DWR, prototype, jQuery
Ext 框架库能够做出很绚丽的页面，但是这个库本身很大(500k) 不适合于大型网站，适合于公司内部网站
(2)、jQuery 操作DOM 和传统js操作DOM对比
js脚本
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脚本
$('#external_links a').click(function() {
return confirm('You are going to visit: ' + this.href);
});
(3)、 $() 函数的四种用法
(1)、$() 函数返回一个含有所有与 CSS 选择器匹配的元素的 jQuery 对象。jQuery 对象 类似于数组，但是它附带有大量特殊的 jQuery 函数。
比方说，您可以通过调用 click 函数把 click 处理函数指定给 jQuery 对象中的所有元素。
(2)、还可以向 $() 函数传递一个元素或者一个元素数组，该函数将把这些元素封装在一个 jQuery 对象中。比方说 window 对象。
$(window).load(function() {
// alert();
});
(3)、有的时候，您希望首先完成图片加载，但是在大多数情况下，您只需加载超文本标志语言（Hypertext Markup Language，HTML）就可以了。通过在文档中创建特殊的 ready 事件，
$(document).ready(function() {
// do this stuff when the HTML is all ready
});
(4)、使用字符串来创建元素。结果会产生一个包含该元素的 jQuery 对象
$('<p></p>') //等价$('p')
.html('Hey World!')
.css('background', 'yellow')
.appendTo("body");
在前一个例子中您可能已经注意到，jQuery 中的另一个功能强大的特性就是方法链接（method chaining）。每次对 jQuery 对象调用方法时，方法都会返回相同的 jQuery 对象。
这意味着如果您需要对 jQuery 对象调用多个方法，那么您不必重新键入选择器就可以实现这一目的：
$('#message').css('background', 'yellow').html('Hello!').show();
(4)、jQuery 选择器
jQuery提供两种方式来选择html的elements，第一种是用CSS和Xpath选择器联合起来形成一个字符串来传送到jQuery的构造器（如：$("div > ul a")）；
第二种是用jQuery对象的几个methods(方法)。这两种方式还可以联合起来混合使用。
$(document).ready(function() {
$("#orderedlist > li").addClass("blue");
});这样，所有orderedlist中的li都附加了样式"blue"。
精确简单的选择对象
$('#element');// 相当于document.getElementById("element")
$('.element');//Class
$('p');//html标签
$("form > input");//子对象
$("div,span,p.myClass");//同时选择多种对象
$("tr:odd").css("background-color", "#bbbbff");//表格的隔行背景
$(":input");//表单对象
$("input[name='newsletter']");//特定的表单对象
find each 使用
find() 让你在已经选择的element中作条件查找,因此 $("#orderedlist).find("li") 就像 $("#orderedlist li")一样。each()方法迭代了所有的li，并可以在此基础上作更多的处理。
$(document).ready(function() {
$("#orderedlist").find("li").each(function(i) {
$(this).html( $(this).html() + " BAM! " + i );
});
});
//选择了所有的"form"元素，并在其中的第一个上call了一个reset()。
$(document).ready(function() {
$("#reset").click(function() {
$("form")[0].reset();
});
});
//文档中所有的form元素，并对它们都执行了一次reset()。
$(document).ready(function() {
// use this to reset several forms at once
$("#reset").click(function() {
$("form").each(function() {
this.reset();
});
});
});
(5)、jQuery 简化Ajax 调用
$.ajax() 函数。您可以指定 xml、script、html 或者 json，jQuery 将自动为回调函数准备合适的结果，这样您便可以立即使用该结果。
还可以指定 beforeSend、error、success 或者 complete 回调函数，向用户提供更多有关 Ajax 体验的反馈。
eg:
$.ajax({
url: 'aServlet.do?method=save&name='+$("#name"),
type: 'GET',
dataType: 'xml',
timeout: 1000,
error: function(){
alert('Error loading XML document');
},
success: function(xml){
// do something with xml
}
});
success: function(xml){
$(xml).find('item').each(function(){
var item_text = $(this).text();
$('<li></li>')
.html(item_text)
.appendTo('ol');
});
}
当 success 回调函数返回 XML 文档后，您可以使用 jQuery 检索这个 XML 文档，其方式与检索 HTML 文档是一样的