JQuery 2

例如隔行变色引入jQuery完成
<script language="javascript" src="jquery.min.js"></script>
<script language="javascript">
$(function(){
 $("table.datalist tr:nth-child(odd)").addClass("altrow");
});
</script>

 

jQuery选择器
$(selector)
$("#showDiv")id选择器
$(".SomeClass")类别选择器
$("p:odd")奇数行的<p>标记
$("td:nth-child(1)")所有表格的第一个单元格，即第一列
$("li>a")子选择器，返回<li>标记的所有子元素<a>,不包括孙标记
$("a[href$=pdf]")属性选择器，选择所有超链接，并且href的属性是以pdf结尾的

$.trim(sString);去除首尾空格的$.trim()方法

 

解决window.onload函数的冲突
jQuery中的ready()方法能够自动将其中的函数在页面加载完成后运行，且同一个页面中可以使用ready()多次
$(function(){
 code;
});

 

创建DOM元素
$(function(){       //ready()函数
 var oNewP = $("<p>这是一个感人肺腑的故事</p>");  //创建DOM元素
 oNewP.insertAfter("#myTarget");    //insertAfter()方法
});

 

扩展jQuery
$.fn.方法名 = function(){}

 

解决$的冲突
jQuery.noConflict();
这时在jQuery中不在使用$,而必须使用jQuery

 

圆角矩形
border-radius:20px;   
-moz-border-radius:20px;  
-webkit-border-radius:20px;  

浏览器兼容性测试
http://tools.css3.info/selectors-test/test.html

 

使用选择器
属性选择器
$("a[title]").addClass("myClass");
$("a[href=10-9.html]").addClass("myClass");
$("a[href^=http://]").addClass("myClass");以http://开头的超链接
$("a[href$=html]").addClass("myClass");以html结尾的超链接
$("a[href*=xj]").addClass("myClass");任意匹配
$("li:has(a)").addClass("myClass");包含选择器，包含了超链接的所有<li>标记

 

位置选择器
:first :last 第一个元素、最后一个元素
:first-child :last-child 第一个子元素、最后一个子元素
:only-child 所有没有兄弟的元素
:nth-child(n) 第n个子元素（从1开始）
:nth-child(odd|even) 所有奇数号或偶数号的元素
:nth-child(nX+Y) 利用公式来计算子元素的位置
:odd或者:even 对整个页面而言的奇数号或偶数号的元素
:eq(n) 页面中的第n个元素（从0开始）
:gt(n) 第n个元素之后的所有元素
:lt(n) 第n个元素之前的所有元素

 

过滤选择器

反向过滤:not(filter)，filter参数必须是过滤选择器，不是p:hidden应该是:hidden
input:not(:radio) 表示<input>标记中所有的非radio元素
//迭代使用选择器
$(":input:not(:checkbox):not(:radio)").addClass("myClass");
注意:input和input区别

 

管理选择结果
获取元素的个数
var i = $("div").size()+1; //获取div块的数目
$(document.body).append($("<div>"+i+"</div>")); //添加一个div块

提取元素
var aDiv = $("div").get(); //转化为div对象数组
aDiv.reverse();  //反序，传给处理函数

获取指定元素的位置
var index = $("div").index($("li[title=xj]"));

 

添加、删除、过滤元素
add()方法添加属性
not()方法去除元素集中的元素，参数不包括特定的元素
$("li[title]").not("img[title*=xj]") 错
$("li[title]").not("[title*=xj]") 对
$("div").filter("[class*=middle]")
filter()方法可接受函数作为参数

查找过滤新元素集合
$("p").find("span")相当于$("span",$("p"))

检测是否包含指定的元素
var bHasImage=$("div").is("img")

 

end()方法控制jQuery链
$("p").find("span").addClass("myClass1").end().addClass("myClass2");往回设置为$("p")

andSelf()方法控制jQuery链
$("div").find("p").addClass("myBackground").andSelf().addClass("myBorder");将<div>和<p>组合在一起