JS——排他思想—最简单最常用的一种！！

最新推荐文章于 2024-05-05 16:12:15 发布
最新推荐文章于 2024-05-05 16:12:15 发布
阅读量2.2k 收藏 2
点赞数 2
分类专栏： JS 文章标签： js javascript 前端 html5 css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44945999/article/details/115196478
版权
一、应用场景

1.轮播图下方的小圆点
2.按钮的选择
3.如果有一组元素，想要其中某个元素实现某种样式，就需要利用循环的排他思想（上面只是举例说明^ _ ^）

二、排他思想实现步骤

1.所有元素清除样式（干掉其他人）
2.给当前元素设置样式（留下我自己）
注意顺序不能颠倒

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>排他思想案例<
最低0.47元/天 解锁文章
月亮小小饼干
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
前端学习笔记，做一个简单的网站-文本框输入排他，学习代码
06-21
前端学习笔记，做一个简单的网站-文本框输入排他
排他思想 （Js代码实现，有经典案例）
学习记录
03-19 1033
排他思想（js实现) 如果有同一组元素，外卖想要某一个元素实现某种样式，需要用到循环的排他思想算法： 所有元素全部清空样式（干掉其他人） 给当前元素设置样式（留下自己） 注意顺序不能颠倒，首先干掉其他人，再设置自己 代码实现： <button>按钮1</button> <button>按钮2</button> <button>按钮3</button> <button>按钮4</button> <but
JS排他思想
m0_63953314的博客
08-17 356
js排他思想应用案例
javascript中的排他思想
最新发布
2301_80174941的博客
05-05 178
如果有同一组元素，想要其中某一个元素实现某种样式， 而其他元素为默认样式，需要用到循环的排他思想算法。3. 注意顺序不能颠倒，首先清除所有元素样式，再设置选中元素样式。点击不同按钮，当前按钮 变为粉色，其余按钮保持默认颜色。1. 所有元素全部清除样式。2. 给当前元素设置样式。
JS中的排它思想
liu0218的博客
07-30 684
当我们在点击一个选项的时候，我们需要清空之前所点击的选项，首先我们先获取到所有选项卡的节点，然后利用循环给每个按钮添加事件，然后在里面嵌套一个循环，在点击这个按钮生效前一步清空之前的所有事件，保证只让当前点击的事件生效，从而实现排它！多个选项中无论如果只有一个会有样式，从而实现排它。......
JavaScript 排他思想
xihuanLilia的博客
02-13 529
排他思想排他思想案例分析 排他思想 如果有同一组数元素 我们想要某一个元素实现某种样式 这时候 需要用到循环的排他思想算法 1 所有元素全部清楚样式 2 给当前的元素设置样式 3 注意顺序 先清楚其他元素 在设置自己 简单的理解为 排他思想，就是排除所有人（包括自己），然后设置自己 案例分析 <body> <button>1</button> <button>2</button> <button>3</
JavaScript排他思想
qq_61716556的博客
05-22 2118
什么是排他思想？ 排他思想是为一组同类型元素中的某一个元素设置样式时，采用的一种特定顺序。首先将所有元素的样式设置为一般样式(包括特定的某个元素)，再为特定元素设置特定样式。 排他思想的优势 排他思想适用于为多个同类型元素设置样式或效果的情况。避免为单个元素重复设置相同样式，可以有效显示出用户操作下某一元素的改变。 实现排他思想的步骤 为全部元素设置一般效果 为特定元素设置特定效果 <!DOCTYPE html> <html lang="en"> <head&gt
身为QQ最顶级会员SVIP8是怎样一种体验.docx
09-27
QQ的最高会员等级SVIP8，是腾讯为其用户提供的最尊贵的身份象征，代表了虚拟社交网络中的特权和尊贵地位。SVIP8的获得并非易事，从超级会员1级升至8级需要近8年的时间，因此，拥有这一级别的用户在腾讯的会员体系中...
JavaScript排他算法实现选项卡的应用研究.pdf
01-03
JavaScript排他算法实现选项卡的应用研究还涉及到DOM操作、CSS层叠样式和JS事件驱动。实现选项卡效果的方法有很多，可以利用CSS伪类以及鼠标锚点来实现，在bootstrap框架也封装了选项卡的切换效果。 本文还讨论了...
互联网平台排他性协议的竞争效应——来自电商平台的证据.zip
10-19
互联网平台排他性协议的竞争效应——来自电商平台的证据
JavaScript(DOM)排他和属性
Han_Zhou_Z的博客
12-02 1929
目录 一、排他思想 1、鼠标事件 二、属性操作 1、获取属性值 2、设置属性值 （1）固有属性值的设置 （2）对于用户自定义的属性值的设置 3、移出属性值 三、HTML5中自定义属性 1、自定义属性规范：data-属性名 2、实现方式 3、获取自定义属性值： 一、排他思想 定义：简单理解就是排除掉其他的（包括自己），然后再给自己设置想要实现的效果。总而言之，排他思想的实现步骤就是所有元素全部清除与设置当前元素。 案例：点击任意一个按钮，其他按钮不被选择，背景颜色变回原来的颜..
JavaScript之排他思想详述
m0_48375854的博客
11-25 3972
在前面的博客中，小熊更新了相关操作元素的方法，但是如果有同一组元素，我们想要某一个元素实现某种样式，这时需要怎么办呢？ 这里就要用到循环的排他思想。 排他思想的算法就是： 排除掉其他的（包括自己），然后再给自己设置想要实现的效果。总而言之，排他思想的实现步骤就是所有元素全部清除与设置当前元素。 可以简单理解为： 所有元素全部清除样式（干掉其他人） 给当前元素设置样式 （留下我自己） 需要注意的是：这里的顺序不能颠倒。 比如，页面有五个按钮，我们想要给它实现循环点击事件：当点到哪个按钮，就让哪个按钮变
排他思想做法
m0_46978034的博客
05-22 909
排他思想分为俩步骤 1.先给所有的元素绑定事件，而在吧所有的元素样式设置为同一种样式 要使用到双for循环 2.在给当前自己设置样式，总结就是先干掉所有人除了自己 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
js排他思想步骤
a1071626267的博客
06-28 726
js排他思想步骤
jQuery 的设置属性值，和获取属性值，attr()和prop()；
F_x_i_a_o_l_i_n_g_的博客
09-25 487
jQuery 的设置属性值，和获取属性值，attr()和prop(); attr(“属性”)：获取属性值 attr(“属性”，“属性值”)：设置属性的属性值 prop(“属性”)：获取属性值 prop(“属性”，“属性值”)：设置属性的属性值 两者的区别 attr可以获得和定义自定义的属性和属性值，prop不行，但是attr已经不进行维护啦，所以推荐使用prop ...
编程思维---排他思想
m0_73596760的博客
10-13 1666
JS 排他思想
七、DOM（下） - 章节课后练习题及答案
热门推荐
熊先森的博客
04-22 1万+
DOM（下） - 章节课后练习题及答案，使用的是人民邮电出版社出版的《JavaScript+jQuery 交互式 Web 前端开发》书籍。
JS的排他思想
weixin_33961829的博客
06-07 1718
一、前言 Tab栏效果切换是常见的功能需求，它实际上运用的就是JS的排他思想。 那么，什么是排他思想呢？ 简而言之，就是在监听成立时，先把所有的样式清除为空，随后按照需求添加需要的样式。 二、案例分析 1. 需求分析 鼠标放到上面的li上，li本身变色(添加类)，对应的span也显示出来(添加类); 2. 功能实现 思路：1.点亮盒子。 2.利用索引值显示盒子。 步骤： 1.获取事件源和相关元...
JavaScript【排他思想及其优化】
Coding
04-02 1920
JavaScript【排他思想及其优化】
举出一个js排他思想算法实例
04-11
Sure, 一个经典的js排他思想算法实例是通过给DOM元素添加class来实现同类元素之间的排他效果。比如，我们可以通过以下代码让同类按钮只能有一个被选中： ``` $('.btn-group > .btn').click(function(){ $(this).addClass('active').siblings().removeClass('active'); }); ``` 当用户点击一个按钮时，我们为其添加.active的类名，同时移除其兄弟元素中的.active类名。这样一来，就实现了同类元素之间的排他效果。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值