简介
一份jQuery选择器使用情况的汇总分析,并以热榜形式展现。
热榜
这个热榜展示了最常用选择器的排名,数据是根据使用jQuery的著名网站分析得来的。热榜中的选择器已被归类(如,'div span'和'ul li'都是'tag tag'形式)。红色部分表示与W3C规范不兼容。% Used一栏表示选择器使用百分比(# of Uses一栏表示选择器使用次数)。只用过一次的选择器没在热榜中罗列。
Selector% Used# of Uses
#id |
51.290% |
1431 |
.class |
13.082% |
365 |
tag |
6.416% |
179 |
tag.class |
3.978% |
111 |
#id tag |
2.151% |
60 |
tag#id |
1.935% |
54 |
#id:visible |
1.577% |
44 |
#id .class |
1.434% |
40 |
.class .class |
1.183% |
33 |
* |
0.968% |
27 |
#id tag.class |
0.932% |
26 |
#id:hidden |
0.789% |
22 |
tag[name=value] |
0.645% |
18 |
.class tag |
0.573% |
16 |
[name=value] |
0.538% |
15 |
tag tag |
0.502% |
14 |
#id #id |
0.430% |
12 |
#id tag tag |
0.358% |
10 |
tag[name$=value] |
0.323% |
9 |
#id :checkbox |
0.323% |
9 |
#id #id :selected |
0.287% |
8 |
.class tag.class |
0.287% |
8 |
tag#id > tag |
0.287% |
8 |
tag, tag |
0.251% |
7 |
tag.class tag |
0.251% |
7 |
tag .class |
0.215% |
6 |
:radio |
0.215% |
6 |
#id, #id, #id |
0.215% |
6 |
#id .class tag |
0.215% |
6 |
:text |
0.215% |
6 |
tag, tag, tag |
0.215% |
6 |
.class .class .class |
0.215% |
6 |
#id tag[name=value] |
0.179% |
5 |
:checkbox |
0.179% |
5 |
tag[name*=value] |
0.179% |
5 |
#id, #id |
0.179% |
5 |
tag.class tag.class tag |
0.143% |
4 |
tag.class .class |
0.143% |
4 |
tag:selected |
0.143% |
4 |
.class .class .class tag |
0.143% |
4 |
.class.class |
0.143% |
4 |
tag:file |
0.143% |
4 |
tag, tag[name=value] |
0.143% |
4 |
#id, tag[name$=value] |
0.143% |
4 |
tag[name!=value] |
0.143% |
4 |
.class .class tag + .class |
0.108% |
3 |
.class .class tag:gt(2) |
0.108% |
3 |
tag:submit, tag:image, tag:submit |
0.108% |
3 |
tag.class tag.class tag.class tag.class tag.class tag.class |
0.108% |
3 |
#id tag tag.class tag.class tag |
0.108% |
3 |
:input |
0.108% |
3 |
tag.class tag.class |
0.108% |
3 |
.class .class tag:has(tag[name^=value]) |
0.108% |
3 |
#id tag.class tag |
0.108% |
3 |
tag:eq(0) |
0.108% |
3 |
#id :input |
0.108% |
3 |
tag#id tag#id tag |
0.108% |
3 |
.class, .class |
0.108% |
3 |
tag:eq(1) |
0.108% |
3 |
tag#id tag |
0.108% |
3 |
.class tag#id |
0.072% |
2 |
#id tag:first |
0.072% |
2 |
#id tag tag[name!=value] |
0.072% |
2 |
.class #id tag tag |
0.072% |
2 |
tag#id tag.class |
0.072% |
2 |
tag:filled |
0.072% |
2 |
tag:first |
0.072% |
2 |
.class tag tag.class |
0.072% |
2 |
#id tag.class tag tag.class |
0.072% |
2 |
tag.class tag.class tag.class |
0.072% |
2 |
#id #id #id tag.class |
0.072% |
2 |
tag[name$=value], #id |
0.072% |
2 |
tag tag tag |
0.072% |
2 |
:submit, tag:image |
0.072% |
2 |
.class .class tag |
0.072% |
2 |
[name=value]:first |
0.072% |
2 |
.class .class, #id |
0.072% |
2 |
#id .class tag.class |
0.072% |
2 |
.class #id .class |
0.072% |
2 |
#id #id tag tag |
0.072% |
2 |
tag[name] |
0.072% |
2 |
tag, tag, tag, tag |
0.072% |
2 |
tag#id tag#id tag.class |
0.072% |
2 |
tag:unchecked |
0.072% |
2 |
#id .class.class |
0.072% |
2 |
#id tag.class tag > tag |
0.072% |
2 |
.class tag tag tag |
0.072% |
2 |
tag.class:first |
0.072% |
2 |
.class tag.class tag |
0.072% |
2 |
tag#id tag.class:first |
0.072% |
2 |
#id tag.class tag.class tag |
0.072% |
2 |
.class tag tag |
0.072% |
2 |
#id .class tag tag |
0.072% |
2 |
#id tag tag#id |
0.072% |
2 |
tag.class > tag |
0.072% |
2 |
#id .class * |
0.072% |
2 |
:input:visible |
0.072% |
2 |
#id .class .class |
0.072% |
2 |
#id > tag > tag > tag > tag > tag |
0.072% |
2 |
#id tag.class tag tag:gt(0) |
0.072% |
2 |
.class, .class, .class |
0.072% |
2 |
#id #id * |
0.072% |
2 |
#id > *:not(#id) |
0.072% |
2 |
#id tag[name^=value] |
0.072% |
2 |
.class tag.class |
0.072% |
2 |
tag:blank |
0.072% |
2 |
分享到:
相关推荐
1. **选择器**:jQuery的选择器功能强大,支持CSS1-CSS3的选择器语法,以及自定义的选择器。例如,`$("#id")`用于选择ID为"id"的元素,`$(".class")`则用于选择所有class为"class"的元素。 2. **DOM操作**:jQuery...
2. **jQuery选择器和事件处理**:jQuery提供了强大的选择器来选取页面上的元素,并且能够方便地绑定事件处理器。在这个例子中,可能会使用`mousedown`、`mousemove`和`mouseup`事件来检测用户的拖拽操作。 3. **...
综上所述,实现“jQuery实现的百度新闻热搜词特效源码”涉及到jQuery的选择器、DOM操作、动画效果和事件处理等多个方面。通过理解这些概念和技术,开发者可以定制自己的动态效果,提升网站的互动性和吸引力。
jQuery的核心是选择器,它允许我们快速地选取DOM元素。例如,`$("#id")`用于选取ID为"id"的元素,`$(".class")`则选取所有class为"class"的元素。在这个案例中,我们可以选择包含热搜词的元素,如`$(".hot-word")`。...
首先,jQuery的核心功能在于它的选择器机制,它允许开发者通过简单的CSS样式的语法选取DOM元素,从而进行一系列的DOM操作。在这个登录框中,开发者可能使用了`$("#elementID")`这样的选择器来选取特定的HTML元素,...
1. **选择器**:jQuery提供了丰富的选择器,如ID选择器(#id)、类选择器(.class)和元素选择器(element),用于快速定位网页中的特定元素。在这个特效中,选择器用于选中包含热搜词的标签。 2. **事件绑定**:jQuery的...
1. **选择器**:jQuery的选择器允许开发者快速地定位到网页上的特定元素,如新闻列表。例如,使用`$("#newsList")`可以选择ID为"newsList"的元素。 2. **DOM操作**:获取到元素后,插件会改变其CSS属性(如位置)来...
例如,通过简单的选择器语法,可以轻松地选取页面上的DOM元素。这在创建动态效果如热气球动画时非常有用,因为它允许我们快速定位到特定的HTML元素并对其进行操作。 在“jQuery热气球动画背景登录框”这个项目中,...
最新版本的jQuery EasyUI 1.3.6版全中文API汉化文档火热出炉,由于很多人和我要chm格式的,所以本次API我提供了2种版本的API,一个还是以前的EXE格式,另外一个就是人气颇高的chm格式。本次还将EasyUI 1.3.6版直接...
3. 使用jQuery选择器获取菜单元素,并绑定事件监听器。 4. 在事件触发时,用JavaScript修改元素的CSS属性,如变换颜色、位置或透明度,模拟熔岩灯效果。 5. 为了性能优化,可以使用requestAnimationFrame进行动画帧...
在实现标签云特效时,jQuery强大的选择器和动画功能将发挥关键作用。 接着,我们来看这个项目的文件结构。"jQuery仿百度新闻标签云关键词代码"这个压缩包包含了一个核心文件,即"jQuery仿百度新闻标签云关键词代码...
在实现拖拽添加锚点的功能时,需要用到jQuery选择器来选择相应的元素,如`.delegate()`和`.find()`方法,这允许开发者以非常简单的方式访问DOM元素。本文通过jQuery来选择输入框的值,并动态生成含有超链接的P标签,...
***boSelect插件:允许将选择框转换为搜索友好型和键盘操作友好的下拉选择器,并且适用于移动设备如手机和iPad。 8. Quttons插件:允许用户将一个按钮或DIV转变为一个“量子纸”,即数字化的纸张,它可以随着内容的...
了解jQuery的基本语法和选择器是开始这个项目的前提,例如`$()`用于选择元素,`.addClass()`和`.removeClass()`用于添加和移除CSS类,`.html()`或`.text()`用于操作元素内容。 2. **DOM操作**:在项目中,你需要...
在本文中,我们将深入探讨如何实现一个自定义的城市选择器,以及其背后的三级联动机制。 首先,我们要理解城市选择器的基本结构。一般来说,一个城市选择器会按照国家、省份(或州)和城市三个层次来组织数据。用户...
嘶嘶声纯JavaScript CSS选择器引擎,旨在轻松放入主机库中。贡献指南本着开源软件开发的精神,jQuery始终鼓励社区代码的贡献。 为了帮助您入门,并在开始编写代码之前,请务必仔细阅读以下重要的贡献准则:您需要...
CSS3则是CSS的升级版,带来了更多样化的样式控制,如阴影效果、渐变、过渡、动画等,同时增加了选择器的多样性,使样式规则更加精确。 JQuery: JQuery是一个高效、简洁的JavaScript库,它简化了DOM操作、事件处理、...
《使用Node.js构建微博热搜榜爬虫:技术详解与实践》 在当今互联网时代,实时了解社会热点成为了人们日常生活中不可或缺的一部分,微博作为中国最具影响力的社交媒体之一,其热搜榜成为了热门话题的重要风向标。本...
CSS通过选择器(如元素选择器、类选择器、ID选择器)来定位HTML元素,并应用相应的样式规则。CSS3引入了更多高级功能,如伪类和伪元素、多列布局、过渡和动画、媒体查询等,使得网页设计更加灵活和响应式。 ...