Jquery学习笔记

1. jQuery内置函数

$.map(array,fn) 对数组中每个元素调用fn函数逐个进行处理，fn函数将处理返回，最后得到一个新数组。但是它不能像$each一样处理dictionary风格的函数。

 

$.each(array,fn)对数组array调用fn函数逐个进行处理，没有返回值。

var arr={“tom”:”汤姆”,”jerry”:”杰瑞”,”lily”:”莉莉”}

$.each(arry,function(key,value){alert(key+”=”+value);});

如果是普通风格的数组，则key的值是序号。

还可以省略function的参数，这个时候用this得到遍历的当前元素。

 

jQuery对象、DOM对象

 

jQuery对象就是通过jQuery包装DOM对象后产生的对象。$(“#div1”).html()等价于：document.getElementById(“div1”).innerHTML;

DOM对象要想通过jquery进行操作，先要转换为jquery对象。

 

将DOM对象转换成jQuery对象的方法，$(DOM对象)；当调用jQuery没有封闭的方法的时候必须用DOM对象，转换的方法：var dobj = jqobj[0]或者obj = jqobj.get(0) 

 

2. jQuery节点遍历

.next()

.nextAll()

.siblings()

 

3. jQuery选择器

基本选择器

$(“#id”)

$(“tagName”)

$(“.className”)

 

多选择器

$(“tagName1,tagName2,tagName3[...]”)

层次选择器

$(“div li”)

$(“div>li”) 获取div下的直接li子元素

$(“.dclass+div”) 获取样式名为dclass之后的第一个div元素（不常用）

$(“.dclass~div”) 获取样式名为dclass之后的所有的div元素（不常用）

 

相对选择器

$(“#div”).click(function(){

$(“ul”, $(this)).css(“background”,”red”);

});

$(“#t1 tr”).click(function(){

$(“td”,$(this)).css(“background”,”red”);

});

 

4. jQuery过滤器

基本过滤器

:first 选取第一个元素。$(“div:first”)选取第一个<div>

:last 选取最后一个元素。$(“div:last:)选取最后一个<div>

:not(选择器)选取不满足“选择器”条件的元素，$(“input:not(.myClass)”)选取样式名不是myClass的<input>

:even、:odd，选取索引是奇数、偶数的元素：$(“input:even”)选取索引是奇数的<input>

:eq(索引序号)、:gt(索引序号)、:lt(索引序号)选取索引等于、大于、小于索引序号的元素，比如$(“input:lt(5)”)选取索引小于5的<input>

$(“:header”)选取所有的h1......h6元素

$(“div:animated”)选取正在执行动画的<div>元素

 

表单过滤器

$(“#form1:enabled”)选取id为form1的表单内所有启用的元素

$(“#form1:disabled”)选取id为form1的表单内所有禁用的元素

$(“input:checked”)选取所有选中的元素（Radio、CheckBox）

$(“select:selected”)选取所有选中的选项元素（下拉列表）

 

表单对象过滤器

$(“:input”)选取所有<input>、<textarea>、<select>和button元素，和$(“input”)不一样，$(“input”)只获得<input>

$(“:text”)选取所有单行文本框，等价地$(“input[type=text]”)

$(“:password”)选取所有密码框，

同理还有:radio、:checkbox、:submit、:image、:reset、:button、:file、:hidden。

 

属性过滤器

$(“div[id]”)选取有id属性的div

$(“div[title=test]”)选取title属性为”test”的div，jQuery中没有对getElementsByName进行封装，用$(“input[name=abc]”)