jquery选择器

2016-08-04  本文已影响11人  子非鱼666

1.:header

如果要选择某个元素中的header元素那么,应该这样写$(element :header);

注意:header与element之间应该加上空格表示element中的:header,而:header前面不应该紧跟其它元素。

2.:contains()

:contains("str")前面紧跟元素名称表示选中包含str的所有该元素,如果要限定某个范围写成这样element1 element2:contain("str")。(解释为:选中element1中包含带有字符串str的element2)

3.:empty

对于:empty的理解类似于:contains()。

$(element1 element2:empty),(解释:选中element1中子节点为空的element2元素,关于子节点的理解(如果元素中包含文本那么也解释为这个元素包含文本子节点))

4.多个匹配条件之间通过“,”隔开

$("h1,h2,h3,[href]")

解释:选取h1,h2 ,h3和带有href属性的元素。

5.空格和不加空格

注意在选择器前面直接添加元素,表示选取符合选择器条件的该元素。

在选择器前面添加空格在添加元素,该元素表明选择器的选择范围,如果没有表示在整个文档中寻找。

6.jQuery 名称冲突

7.事件

1.bind();bind() 方法为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数。

   $(selector).bind(event,data,function);添加一个事件处理程序

   $(selector).bind({event:function,event:function, ...});添加多个事件处理程序

2.focus();blur()

获得焦点(失去焦点)是触发function

3.delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。

使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。

$(selector).delegate(childSelector,event,data,function)

4.die() 方法移除所有通过 live() 方法向指定元素添加的一个或多个事件处理程序。

$(selector).die(event,function)

8.动画

1.$(selector).animate({params},speed,callback);

{params}这里是产生动画的css,callback是动画播放完成后执行的函数,可以为空。

*(默认地,所有 HTML 元素都有一个静态位置,且无法移动。如需对位置进行操作,要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute!)

也可以定义相对值(该值相对于元素的当前值)。需要在值的前面加上 += 或 -=:


$("button").click(function(){

$("div").animate({

left:'250px',

height:'+=150px',

width:'+=150px'

});

});

您甚至可以把属性的动画值设置为 "show"、"hide" 或 "toggle":

$("button").click(function(){

$("div").animate({

height:'toggle'

});

});

上一篇下一篇

猜你喜欢

热点阅读