jquery selector

最新推荐文章于 2024-04-03 01:22:41 发布

iteye_6866

最新推荐文章于 2024-04-03 01:22:41 发布

阅读量113

点赞数

分类专栏：开发语言文章标签： javascript ViewUI

开发语言专栏收录该内容

10 篇文章 0 订阅

订阅专栏

、 All Selector (“*”)：匹配所有元素。如:

　　$(“*”).css(“border”,”3px solid red”);将所有<body>内的任何元素都进行CSS化。

$("#test").find("*").css("border","3px solid red"). //将id为test内的所有元素CSS化

2、:animated Selector,匹配动画的元素，如：<script>

$("#run").click(function(){ $("div:animated").toggleClass("colored");//为动画的div转换css样式 }); function animateIt() { $("#mover").slideToggle("slow"); //为id为mover的div添加动画效果 } animateIt(); </script>

3、jQuery('[attribute|="value"]')：匹配以value开头的属性值或者等于value的属性值，如：<input name="man-news" /> <input name="milkman" /> <input name="letterman2" /> <input name="newmilk" /> <input name="milk man" />

则$('input[name=|"man"]') 会自动匹配第一个input框

4、jQuery('[attribute*="value"]')：匹配属性值中含有value的元素，如3所示例子中

　　$('input[name*="man"]')自动匹配第1、2、3、5个Input框　　

5、jQuery('[attribute~="value"]')：匹配独立的一个属性值value，value以一个独立的单词存在，前后用空格与其他字符分开，如3所示例中

　　$('input[name~="man"]')自动匹配第5个input框。

6、jQuery([attribute$="value"])：匹配以value结尾的属性值元素。　如3所示例中　

　　$('input[name="man"]'),自动匹配第2、5个input元素

7、jQuery([attribute^="value"])：匹配以value开始的属性值元素。　如3所示例中　

　　$('input[name^="man"]'),自动匹配第1个input元素

8、jQuery([attribute="value"])：匹配属性值等于value的元素。　如3所示例中　

　　$('input[name="man"]'),没有匹配的。

9、jQuery([attribute!="value"])：匹配属性值不等于value的或者元素中没有该属性,如3所示例中

　　$('input[name!="newmilk"]'):匹配第1、2、3、5个input元素

10、:button selector:找出所有button元素或者是type=button的元素，如$(":button")

11、:checkbox selector ：找出所有type=checkbox的元素，如：

　　$("form input:checkbox"),$(":checkbox") 等价于$("*:checkbox")

12、child selector("parent > child"):指定父元素下的子元素，只是用于一级关系。如：

<ul class="topnav"> <li>Item 1</li> <li>Item 2 <ul><li>Nested item 1</li><li>Nested item 2</li><li>Nested item 3</li></ul> </li> <li>Item 3</li> </ul>  <script>$("ul.topnav > li").css("border", "3px doublered");</script>

13、class selecotr (".class")：class为该值的元素，如上述例子中的$("ul.topnav")

14、:contains(text) selector ,jQuery(':contains(text)'):文本包含text的元素，如：

<div>hahah</div> <div>ccc</div> <script>$("div:contains('ccc')").text("dd")</script> //找出div文本中含有ccc的字符，并将其文本变为dds

文章内容来自jquery官网 http://api.jquery.com/category/selectors/

iteye_6866

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery selector

、 All Selector (“*”)：匹配所有元素。如:　　$(“*”).css(“border”,”3px solid red”);将所有&lt;body&gt;内的任何元素都进行CSS化。 $("#test").find("*").css("border","3px solid red"). //将id为test内的所有元素CSS化2、:animated Sel...
复制链接

扫一扫