jquery选择器和CSS选择器有哪些区别

小编给大家分享一下jquery选择器和CSS选择器有哪些区别,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!

区别:1,两者的作用不同,CSS选择器找到元素后为设置该元素的样式,jquery选择器找到元素后添加行为,2,jquery选择器拥有更好的跨浏览器的兼容性;3、CSS选择器和jquery选择器的效率不同。

我们知道,jquery选择器和CSS选择器的写法十分类似,都具有隐式迭代的特点,无需循环遍历符合选择器要求的每个元素,使用起来相对方便,通常,把CSS选择器用$(“;”)包起来就成了一个jquery选择器,如

CSS选择器jquery选择器ID选择器# myID美元(“# myID")类选择器.myClass美元(“.myClass")标签选择器p $ (“p")层次选择器p比;强劲的美元(“p> strong") css称为伪类选择器
jQuery称之为过滤选择器p: nth-child(3)美元(“p: nth-child (3)“)

见下面的例子,css为每个段落的文字设置成14 px,颜色是红色,jQuery中设置文字为16 px,颜色为蓝色,因为jQuery设置的是DOM加载后的行为,所有的段落表现为蓝色,16 px字

& lt; ! doctype  html> 　　& lt; html> 　　& lt; head> 　　& lt; meta  charset=皍tf-8"祝辞 　　& lt; title>选择器& lt;/title> 　　& lt; style 类型=拔谋?css"比; 　　p {,字体大小:14 px;,颜色:# F00 } 　　p: nth-child(3){颜色:# 690} 　　& lt;/style> 　　https://www.yisu.com/zixun/& lt; script  src=" jquery/jquery-1.11.3.js "> 　　<>脚本 　　$(文档)时函数(){ 　　$ (“p”) . css({“颜色”:“# 00 f”、“字体大小”:“16 px”}); 　　$ (" p: nth-child (3)”)。css({“字体大小”:“24 px”}); 　　})；> 头 　　<身体> 　　

第一段 　　

第二段 　　

第三段 　　

第四段 　　 　　

<强>那么两者的区别在哪里呢?

1,两者的作用不同,CSS选择器找到元素后为设置该元素的样式,jQuery选择器找到元素后添加行为。

2, jQuery选择器拥有更好的跨浏览器的兼容性。

3,选择器的效率。

CSS选择器的效率

1, id选择器(# myid)

2类选择器(。myclassname)

3标签选择器(p, h2, p)

4,相邻选择器(h2 + p)

5,子选择器(ul祝辞li)

6,后代选择器(李)

7日通配符选择器(*)

8属性选择器([rel=癳xternal"])

9日,伪类选择器(悬停,李:nth-child)

上面九种选择器的效率是从高到低排下来的,基中ID选择器的效率是最高,而伪类选择器的效率则是最底。详细的介绍大家还可以查看写有效的CSS选择器(地址:http://csswizardry.com/2011/09/writing-efficient-css-selectors/)。

jQuery选择器的效率

1, ID选择器美元(& # 39;# ID # 39;)和元素标签选择器美元(& # 39;形式# 39;)

2类选择器美元(& # 39;.className& # 39;)

3,属性选择器美元(& # 39;[属性=值]& # 39;)和伪类选择器美元(& # 39;:隐藏# 39;)

以上是“jQuery选择器和CSS选择器有哪些区别”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注行业资讯频道!

jquery选择器和CSS选择器有哪些区别