jQuery:你可以选择CSS规则而不是类吗？ - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

书写高质量jQuery代码的6条经验

一、正确引用jQuery 尽量在body结束前才引入jQuery，而不是在head中。借助第三方提供的CDN来引入jQuery，同时注意当使用第三方CDN出现问题时，要引入本地的jQuery文件。...二、优化jQuery选择器高效正确的使用jQuery选择器是熟练使用jQuery的基础，而掌握jQuery选择器需要一定的时间积累，我们开始学习jQuery时就应该注意选择器的使用。...因为ID选择器和元素选择器是原生的JavaScript操作，而类选择器不是，大家顺便可以看下find context 区别，find() children区别。...2.1、一些规则 CSS解析引擎将自右向左计算每一条规则，它从关键选择器开始，自右向左计算每一个选择器，直到发现一个匹配的选择器，如果没有找到匹配的选择器则放弃查找。使用较低层的规则通常更有效率。...通常请情况下，请保持选择器简单明了（比如充分使用ID选择器），尽可能的使用关键选择器更具体，无论对JavaScript还是CSS，这都可以加块网站的速度。

2.1K9 0

高质量jQuery代码的十二条经验

1、正确引用jQuery 尽量在body结束前才引入jQuery，而不是在head中。借助第三方提供的CDN来引入jQuery，同时注意当使用第三方CDN出现问题时，要引入本地的jQuery文件。...选择器高效正确的使用jQuery选择器是熟练使用jQuery的基础，而掌握jQuery选择器需要一定的时间积累，我们开始学习jQuery时就应该注意选择器的使用。...因为ID选择器和元素选择器是原生的JavaScript操作，而类选择器不是，大家顺便可以看下find context 区别，find() children区别。...2.1、一些规则 CSS解析引擎将自右向左计算每一条规则，它从关键选择器开始，自右向左计算每一个选择器，直到发现一个匹配的选择器，如果没有找到匹配的选择器则放弃查找。使用较低层的规则通常更有效率。...如果你想深入的研究对这个话题你会发现很多乐趣。记住，jQuery并非不可或缺，仅是一种选择。思考为什么要使用它。DOM操作？ajax？模版？css动画？还是选择符引擎？

1.9K4 0

您找到你想要的搜索结果了吗？

是的

没有找到

程序员Web面试之jQuery

在求职大军中，IT行业的程序员、码农是工科类大学生的热门选择之一，尤其是近几年Web的如火如荼，更是吸引了成千上万的程序员投身其中追求自己的梦想，这篇文章以Web面试官的经历整理而成，希望能对你有所帮助...jQuery的文件规则，如“jquery-1.4.1.j s”，其中1.4.1是JS文件的版本的版本号。...而制约用户体验的关键因素之一是浏览器下载Web文件大小，包括*.html、图片、*.js、*.css等文件。...jQuery的语法结构可以分为四部分：默认情况下，所有Jquery的命令开始以一个“$”符号。其次是HTML元素的选择。例如下面是我们通过ID“txt1”选择一个HTML文本框。...可以。如何用jQuery对HTML元素事件进行附加？下面通过2个例子来说明例子1，选择所有的button元素，在其click事件中，对所有p元素进行toggle。

4K10 0

最常见的 20 个 jQuery 面试问题及答案

ID 选择器使用 ID 来选择元素，比如 #element1，而 class 选择器使用 CSS class 来选择元素。...你可按需修改它，比如用 id 属性而不是 name 属性来获取标签。　　8. jQuery 里的 each() 是什么函数？你是如何使用它的？...你也还可以看看用来向DOM中添加元素的 appendTo() 方法. 　　15. 你如何利用jQuery来向一个元素中添加和移除CSS类?...你可按需修改它，比如用 id 属性而不是 name 属性来获取标签。　　8. jQuery 里的 each() 是什么函数？你是如何使用它的？...你也还可以看看用来向DOM中添加元素的 appendTo() 方法. 　　15. 你如何利用jQuery来向一个元素中添加和移除CSS类?

16.3K3 0

前端开发面试题

选择器的最后面的部分为关键选择器（即用来匹配目标元素的部分）；如果规则拥有 ID 选择器作为其关键选择器，则不要为规则增加标签。...样式系统从关键选择器开始匹配，然后左移查找规则选择器的祖先元素。只要选择器的子树一直在工作，样式系统就会持续左移，直到和规则匹配，或者是因为不匹配而放弃该规则。...JS 怎么实现一个类。怎么实例化这个类 JavaScript中的作用域与变量声明提升？如何编写高性能的Javascript？那些操作会造成内存泄漏？ JQuery的源码看过吗？...jquery.extend 为jquery类添加类方法，可以理解为添加静态方法 jquery.fn.extend: 源码中jquery.fn = jquery.prototype，所以对jquery.fn...的扩展，就是为jquery类添加成员函数使用： jquery.extend扩展，需要通过jquery类来调用，而jquery.fn.extend扩展，所有jquery实例都可以直接调用。

6.1K5 2

Github 移除 JQuery 的过程

实现CSS类名切换； CSS现在支持在样式表而不是JavaScript中定义可视化动画； $.ajax请求可以使用Fetch标准执行； addEventListener（）接口足够稳定，可以跨平台使用；...作者希望在这个页面上有一个或多个js小部件元素吗？另外，如果我们更新了页面标记，并且意外地漏掉了js小部件的类名，浏览器中的异常是否会通知我们出了问题？...默认情况下，当没有匹配初始选择器时，jQuery会自动跳过整个expresion；但对我们来说，这种行为是一个bug，而不是一个特性。...我们之所以选择Flow而不是alternatives，是因为当时@Flow弱模式等特性允许我们逐步高效地开始将类型应用到基本上没有类型的代码基。...相反，我们：设置指标，跟踪每行代码使用jQuery调用的比率，并随时间监视该图，以确保它要么保持不变，要么下降，而不是上升。我们不鼓励在任何新代码中导入jQuery。

3.6K1 0

继续死磕前端

这个小小的 js 文件，你可以说他是插件，也可以称其为框架，随你喜欢，只要知道一点，它很好用就可以了。...1.1 jquery 选择器还记到大明湖畔（CSS）的夏雨荷（选择器）吗？选择器可以快速定位到元素并为其应用样式效果。jquery 选择器的选择规则与 CSS 相同，只是目的是为其添加操作。...").css("color","red"); 如果你足够的细心，你也许会问，选择器一般都选择多个元素，那么你获取到的是哪一个元素的值呢？...var re=new RegExp('规则', '可选参数'); var re=/规则/参数; 大家可以看到，其由规则与参数两部分组成。...这只是一种机制，但是我们并不是任何情况下都需要，那么可以将其关掉。

4.4K1 0

前端面试那些坑

CSS 介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？ CSS选择符有哪些？哪些属性可以继承？ CSS优先级算法如何计算？ CSS3新增伪类有那些？如何居中div？...JS 怎么实现一个类。怎么实例化这个类 JavaScript中的作用域与变量声明提升？如何编写高性能的Javascript？那些操作会造成内存泄漏？ JQuery的源码看过吗？...jQuery里的fire函数是什么意思，什么时候用？ jQuery 是通过哪个方法和 Sizzle 选择器结合的？...（click 有 300ms 延迟,为了实现safari的双击事件的设计，浏览器要知道你是不是要双击操作。）...HTML5，CSS3，Web前端，jquery，javascript，前端学习路线，各类问题，我们都可以为你解决。

3.4K6 0

前台开发从头说起：谈谈CSS选择符

一般稍微接触过css的网页设计人员，都会很快地学会三种css选择符：元素选择符（例如：body 、a 、li ） ID选择符（例如：#head、#body、#foot）类选择符（例如：.red、...实际上css还支持一些更丰富的选择符。但是能够被浏览器广泛支持的其实主要就是上面这几种，其它的选择符在css中往往用来区别处理不同的浏览器，或者用在jQuery一类的框架中。本文就不提了。...hover ul {} 那么，在实际开发中，为什么很多网页设计人员还是离不开多如牛毛的ID和class呢（我要声明一下，我从来没有说完全抛弃id和class，我的观点是他们应该尽量少，并且由文档结构决定而不是由...第三、css选择符的优先级不清楚。css是支持继承和覆盖的，什么时候继承，什么时候覆盖。两条规则都对相同元素做出了样式规定而且样式规定重复的情况下，哪一条规则会被应用呢？...由于css3的选择符目前还没被广泛支持，而结构又没有差异，不借助javascript有困难了。

1.6K7 0

前沿 | 2017年前端开发工具趋势

你会用 Sass 和 Autoprefixer 等高级的CSS辅助技能吗？你的 JavaScript 知识是否融汇贯通，你是否喜欢使用 Gulp ， npm 和 jQuery ？...只有0.1%的网站被发现正在使用React，但请记住，调查结果是从前端开发人员收集的 – 而不是所有的Web开发人员。...如果你确实需要支持 IE11 及以下版本，编写 ES5 代码不是更容易吗？...我建议你研究一些预处理器和命名方案，以便了解每个工具可以实现什么 – 即使是你选择不使用它们。 JavaScript 方面的工具不太好说。...我从不羡慕那些尝试为新项目选用类库或框架的人。从调研结果来看，jQuery是明显是最受欢迎的。

9021 0

前端面试宝典 v1

怎么实例化这个类严格来讲js中并没有类的概念，不过js中的函数可以作为构造函数来使用，通过new来实例化，其实函数本身也是一个对象。 48、JavaScript中的作用域与变量声明提升？...他们是动态的样式语言，是CSS预处理器,CSS上的一种抽象层。他们是一种特殊的语法/语言而编译成CSS。...而Less不支持; Sass是基于Ruby的，是在服务端处理的，而Less是需要引入less.js来处理Less代码输出Css到浏览器 57、关于javascript中apply()和call()方法的区别...（4）当需要设置的样式很多时设置className而不是直接操作style。（5）少用全局变量、缓存DOM节点查找的结果。减少IO读取操作。...（click 有 300ms 延迟,为了实现safari的双击事件的设计，浏览器要知道你是不是要双击操作。）九、NodeJs 1.

3.7K4 1

25个常规方法优化你的jquery代码

尽可能使用ID而不是class jQuery利用classes进行DOM元素选择操作与通过ID进行选择一样容易，因此与之前相比更自由的使用classes进行元素选择操作很有吸引力。...因此我修改上述代码以使用ID而不是class，然后通过ID进行选择。 ...当执行选择操作时，jQuery函数可以指定第二个参数：jQuery( expression, context )通过给选择器提供一个上下文，那就会在这个context中进行元素查找，而不必在整个DOM文档中查找元素...如果你向DOM中添加了新的元素，尽管这些新元素被选择器所匹配，但是这些新元素并不会绑定上事件处理（你同意我的观点吗？），因此不会有事件发生。 ...然而当你需要基于其它一些内容进行元素选择而jQuery却没有提供该选择器时，你能做什么呢？嗯，一个解决方案可能是从一开始就给元素添加上classes，从而利用这些classes进行元素的选择操作。

2.9K1 0

2021大厂（阿里、百度、字体跳动、腾讯）前端面试题库

4.你知道有哪些缓存方式吗？ 5.缓存位置 6.http缓存怎样生效的？...2.提交时发生冲突，你能解释冲突是如何产生的吗？你是如何解决的？ 3.如果本次提交误操作，如何撤销？ 4.如果我想修改提交的历史信息，应该用什么命令？ 5.你使用过git stash命令吗？...14.分别简述 computed 和 watch 的使用场景 15.v-on 可以监听多个方法吗？ 16.$nextTick 的使用 17.vue 组件中 data 为什么必须是一个函数？...2.网页上有5个div元素，如何使用 jQuery来选择它们？ 3.$(this) 和 this 关键字在 jQuery 中有何不同？ 4.使用CDN加载 jQuery库的主要优势是什么？...9.jquery中的选择器和CSS中的选择器有区别吗？ 10.jQuery的特点都有什么？ React 1.什么是React？ 2.React有什么特点？ 3.列出React的一些主要优点。

3K2 1

2017年前端开发工具趋势

你有两年以上的前端开发经验吗？你会用 Sass 和 Autoprefixer 等高级的CSS辅助技能吗？...如果你确实需要支持 IE11 及以下版本，编写 ES5 代码不是更容易吗？...我建议你研究一些预处理器和命名方案，以便了解每个工具可以实现什么 – 即使是你选择不使用它们。 JavaScript 方面的工具不太好说。...我从不羡慕那些尝试为新项目选用类库或框架的人。从调研结果来看，jQuery是明显是最受欢迎的。...你可以选择一个框架，如 React，因为它很受欢迎 – 但这并不代表它就适用于你的应用。即使 React 将最终被更好，更优秀的东西取代。

1.2K7 0

求职 | 史上最全的web前端面试题汇总及答案2

4、CSS 选择符有哪些？哪些属性可以继承？优先级算法如何计算？ CSS3新增伪类有哪些？...1.id选择器（ # myid） 2.类选择器（.myclassname） 3.标签选择器（div, h1, p） 4.相邻选择器（h1 + p） 5.子选择器（ul > li） 6.后代选择器（li...没有用到，但我知道html的websockets、flash的socket、ajax长轮询等都可以实现。 8、你在AJAX中有遇到乱码吗？如果遇到，你是如何解决的？ ①遇到过。...JQuery 1、你使用过jQuery吗？如果有，你为什么要使用jQuery呢？ ①用过。...11、你知道jQuery插件吗？你了解jQuery执行原理和插件机制吗？你都用过哪些jQuery插件？ ①知道jQuery插件。 ②其原理是扩展jQuery本身及其核心函数的原型实现。

9.6K2 0

2017年前端开发工具趋势

你有两年以上的前端开发经验吗？你会用 Sass 和 Autoprefixer 等高级的CSS辅助技能吗？...如果你确实需要支持 IE11 及以下版本，编写 ES5 代码不是更容易吗？...我建议你研究一些预处理器和命名方案，以便了解每个工具可以实现什么 – 即使是你选择不使用它们。 JavaScript 方面的工具不太好说。...我从不羡慕那些尝试为新项目选用类库或框架的人。从调研结果来看，jQuery是明显是最受欢迎的。...你可以选择一个框架，如 React，因为它很受欢迎 – 但这并不代表它就适用于你的应用。即使 React 将最终被更好，更优秀的东西取代。

1.5K6 0

前端工程师面试题汇总

CSS 介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？ CSS选择符有哪些？哪些属性可以继承？ CSS优先级算法如何计算？ CSS3新增伪类有那些？如何居中div？...CSS优化、提高性能的方法有哪些？浏览器是怎样解析CSS选择器的？在网页中的应该使用奇数还是偶数的字体？为什么呢？ margin和padding分别适合什么场景使用？...JS 怎么实现一个类。怎么实例化这个类 JavaScript中的作用域与变量声明提升？如何编写高性能的Javascript？那些操作会造成内存泄漏？ JQuery的源码看过吗？...jQuery里的fire函数是什么意思，什么时候用？ jQuery 是通过哪个方法和 Sizzle 选择器结合的？...（click 有 300ms 延迟,为了实现safari的双击事件的设计，浏览器要知道你是不是要双击操作。）

3.1K8 0

Jump Start Bootstrap 第1章

好的CSS框架的一些主要亮点包括：更快的开发组织和维护代码让你把时间花在创新上，而不是重新发明轮子 Bootstrap的起源在2011年，在Twitter工作的的一对网页开发者，Mark Otto...在2013年发布的版本中，类的名称和项目的文件夹结构都发生了变化。但是请注意，Bootstrap3并不是向后兼容的。你不能通过替换核心的CSS和JavaScript文件，直接迁移到这个版本。...为了给他们一个特别的体验，你需要替换他们的CSS规则并定义你的自己的。使用CSS自定义Bootstrap 这种类型的定制通常被称为覆盖默认的CSS。...我们将使用Chrome，如图5.2所示，但是您可以使用任何类似的工具，比如Firefox中的Firebug。填充、字体大小和边界半径等属性来自btn类，而属性背景则应用于类btn-primary。...CSS文件中删除CSS样式。如果您想要更改web页面中仅一个特定按钮的样式，而不是针对Bootstrap的选择器，请使用ID来应用CSS更改。

5.8K4 0

【前端性能】必须要掌握的原生JS实现JQuery

很多时候，我们经常听见有人说jquery有多快多快。在这个各种类库满天飞的时候，不得不说的是，能有原生JS快吗？...通过传递一个查询字符串给CSS选择器，它将会在DOM元素中检索所有的匹配。然而在大多数的情况下，我们可以使用相同的代码量用原生JS轻易实现。...CSS 操作的原生实现在JQuery中可以轻松实现对css的操作，增加属性、删除属性或是检测是否存在某个类。...那么你是否觉得使用原生JS实现会很麻烦呢？其实不然，因为有classList。下面是一些关于JQuery css操作的JS原生实现。...的属性，而并非将它们全部传递给JQuery的Css函数时，性能明显会快很多。

1.7K3 0

jQuery

jQuery特性隐式迭代链式编程，在于一个方法返回的是一个jQuery对象，既然是jQuery对象就可以点出jQuery的方法来 window.onload 资源加载完成时调用 $(function...() 设置和获取样式获取样式属性值 $("#div1").css("width"); 设置的是行内样式$('#div1').css('width', '300px') $('#div1').css...('height', 300) 设置多样式$('#div1').css({ //属性可以不加引号 //如果是复合属性则必须采取驼峰命名法，值不是数字要加引号 'width': '300px...，而不是mouseover 鼠标离开事件使用mouseleave，而不是mouseout 案例-突出显示案例-手风琴淘宝服饰精品 index() $(‘li’).index() 获取li标签在兄弟元素间的索引值....用sTest调用未覆盖的父类成员方法时，该方法中如果使用到了被隐藏的变量或方法时，规则同上； jQuery background-color 和 backgroundColor 入口函数 $(document

2.1K2 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭