jquery的基本使用

方法连缀：
$('p').removeClass('classFoo').addClass('classBar');

方法迭代：
可以使用each方便对元素列表进行循环操作
$('li').each(function(i){
    alert( typeof this);
});

css选择器：
$('*')  选择所有元素
$('tag') 选择所有html标签中的tag元素
$('tagA tagB')选择作为tagA后代的所有tagB元素
$('tagA,tagB,tagC')选择所有tagA元素，tagB元素，tagC元素
$('#id')和$('tag#id')选择所有ID为id或者ID为id且标签为tag的元素
$('.className')是clas为className的元素

tagA tagB是更具体的后代元素
tagAtagB是同时满足条件

$('tag[attr]')  选择所有带有attr属性的tag元素

也可以使用一些伪类和伪元素选择器 基于在他们在文档中的文职而不必通过类名或者ID而找到任意一个特定的元素

选择文章中nav元素包含的所有链接  用DOM比较麻烦
但使用选择器用法可以缩短为很少的字符 
var links=$('article nav a');
这样代码不仅清晰 而且容易看懂

库提供还有专有的选择器
比如 选择偶数和奇数元素       even是偶数
$('tr:odd').addClass("odd");  奇数

$('tag:odd')   选择匹配元素集中的奇数元素
$('tag:even')     偶数个个数 特别时候突出表格行
$('tag:eq(0)') 和$('tag:nth(0)')选择匹配元素集中的第n个元素 如页面的第一个段落
$('tag:contains('test')')   包涵指定文本的所有元素
$('tag:gt(n)')选择匹配元素集中所有大于n的所有元素
$('tag:lt(n)')选择匹配元素集中所有小于n的所有元素
$('tag:first') 等效于eq(0);
$('tag:last') 选择匹配元素集中的最后一个元素
$('tag:parent') 选择匹配元素集中包涵子元素的所有元素
$('tag:visible')   所有可见元素
$('tag:hidden')   所有隐藏的元素

举例：修改页面第一个段落的字体粗细
$("p:first").css("font-weight","bold");
显示素有隐藏的div元素
$("div:hidden").show();
隐藏所有包涵单词  scared的div元素
$("div:contains('scared')").hide();


jQuery还提供了专门为表单设计的表达式 用于快速访问表单元素
:input   选择表单中所有的元素 （input select textarea button）
:text    type=“text”
:password  type="password"
:radio     type="radio"
:checkbox  type="checkbox"
:submit    type="submit"
:image     type="image"
:reset     type="reset"
:button    type="button"


生成内容 ：
用jQuery创建新的DOM元素很简单   把HTML作为$函数的参数传入 可创建新的节点   下面是给body元素添加一个新的div的元素 新的div元素有一个值为example的id 并且包涵“hello”
$('<div id="example">Hello</div>').appendTo(document.body);

使用jQuery模板插件可以在html字符串中声明一些特殊的变量如  ${term} 这些变量随后可以被替换成一组数组或者其他模板

操作内容 
比如  appendTo或者insertAfter
把一个列表的所有元素全部转移到另一个列表
$('ul#list1 li').appendTo("ul#list2");

如果是复制过去则这样：
$('ul#list1 li').clone().appendTo("ul#list2");


加载事件：
1.function xx(){

}
$(xx);
也可以：
$(function(){

})
2.$(document).ready(function(){
})

还有很多特定于元素的事件  例如focus。click等等
举例：  批量注册事件
$('a').click(function(event){
window.open(this.getAttribute('href'));
return false;
})

就算没有用户交互 也可以调用相应的方法触发：
$('a:first').click();

举例：blur和focus
$(function(){
    $('form input[placeholder]').focus(function(){
    var input=$(this);
    if(input.val()==input.attr('placeholder')){
        input.val('').removeClass('placeholder');
    }
    }).blur(function(){
        var input=$(this);
        if(input.val==''){
            input.val(input.attr('placeholder')).addClass('placeholder');
        }
    }).blur();
})

基于css属性的动画：
原来的:
var links=list.getElementsByTagName("a");
links[0].onmousever=function(){
    moveElement("preview",-100,0,10);
}
links[0].onmousever=function(){
    moveElement("preview",-200,0,10);
}
links[1].onmousever=function(){
    moveElement("preview",-200,0,10);
}

修改后：
$('a').each(function(i){
    var preview=$('#preview');
    var final_x=i*-100;
    $(this).onmousever(function(){
        preview.animate({left:final_x},10);
    })
})

还有很多jquery UI套件和jquery缓动插件
也还有很多组合动画