一、属性过滤选择器:

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

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

$(“div[title != test]”) 选取title属性不为”test”的<div>

$(“div[id *= div]”) 选取给定的属性包含某些值的元素。还可以选择开头、结束、包含等,条件还可以复合。

 

二、表单对象选择器(过滤器)

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

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

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

$(“select option:selected”)

案例:歌曲选择,实现全选、反选

//获取选中的checkbox的值
$(“input[value=checked1]”).click(function(){
         $(“input[type=checkbox]:checked”).each(function(){
         //this是包装集中的每一项,是Dom对象
         alert($(this).val());
})
})

 

三、表单选择器:

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

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

$(“:password”)选取所有的密码框。同理还有:radio、:checkbox、:submit、:image、:reset、:button、:file、:hidden

 

四、动态创建Dom节点

//添加link标签到:
//div的结束标签之前
$(“#d1”).prepend($link);
//div的开始标签之后
$(“#d1”).prepend($link);
//div的开始标签之前
$(“#d1”).before($link);
//div的结束标签之后
$(“#d1”).after($link);

 

append与appendto方向相反

remove与empty:

remove 删除节点;empty清空节点内容但不删除节点

 

五、事件

Jquery中的事件绑定:$(“#btn”).bind(“click”,function(){}),每次都这么调用太麻烦,所以jQuery可以用$(“#btn”).click(function(){})来简化。解除绑定:unbind

一次性事件:如果绑定的事件只想执行一次随后立即unbind可以使用one()方法进行事件绑定。

合成事件hover,hover(enterfn,leavefn),当鼠标放在元素上时调用enterfn方法,当鼠标离开元素时调用leavefn方法。 toggle()

mouseover和mouseenter的区别:mouseover会有事件冒泡。

如果想获得事件相关的信息,只要给相应的匿名函数增加一个参数:e,e就是事件对象。调用事件对象的stopPropagation()方法终止冒泡。e.stopPropagation();例:

$(“tr”).click(function(e){alert(“tr被点击”);e.stopPropagation();});

事件冒泡中this和e.target不同,this是监听事件的对象,e.target是触发事件的对象。

阻止默认行为:有的元素有默认行为,比如超链接点击后会转向新链接、提交按钮默认会提交表单,如果想阻止默认行为只要调用事件对象的preventDefault()方法和Dom中的window.event.returnValue=false效果一样。例:

$(“a”).click(function(e){alert(“所有超链接暂时全部禁止点击”);e.preventDefault();});

 

六、动画

show()、hide()方法会显示、隐藏元素。用toggle()方法在显示、隐藏之间切换。例:

$(“:button[value=show]”).click(function(){$(“div”).show();});
$(“:button[value=hide]”).click(function(){$(“div”).hide();});

如果show、hide方法不带参数则是立即显示、立即隐藏,如果指定速度参数则会用指定时间进行动态显示、隐藏,单位为毫秒,也可以使用三个内置的速度:fast(200毫秒)、normal(400毫秒)、slow(600毫秒),jQuery动画函数中需要速度的地方一般也可以使用这三个值,如toggle、slideDown、slideUp、fadeOut、fadeIn

 

注意:

1、  addClass(“black”); 不是addClass(“.black”);

2、  attr(“calss”,”black”)和addClass()的区别:attr重置样式,addClass附加样式

3、  remove()会移除对象的事件,不会移除样式;append()把对象移动过去。

例:$(this).remove().appendTo($(“#cn”));