【js案例】讲一下webApi中的核心的“排他思想”算法

最新推荐文章于 2023-08-28 23:40:05 发布

嘻咦啊写

最新推荐文章于 2023-08-28 23:40:05 发布

阅读量242

点赞数 1

文章标签： javascript 算法前端

本文链接：https://blog.csdn.net/belloc_li/article/details/123169080

版权

如果有同一组元素，我们想要某一个元素实现某种样式，需要用到循环的排他思想算法：

所有元素全部清除样式（干掉所有人）
给当前元素设置样式（只复活自己）
注意顺序不能颠倒，首先干掉其他人，再复活（设置）自己

接下来看案例

案例一：

在这里插入图片描述

这一排5个按钮，只有在我点到哪个的时候哪个才变红，其他的都是默认样式。要实现这个效果，用css也可以实现，但今天我们用js中“排他思想”算法来实现它。

代码如下：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
  </head>
  <body>
    <button>按钮1</button>
    <button>按钮2</button>

最低0.47元/天解锁文章

嘻咦啊写

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【js案例】讲一下webApi中的核心的“排他思想”算法

如果有同一组元素，我们想要某一个元素实现某种样式，需要用到循环的排他思想算法：所有元素全部清除样式（干掉所有人）给当前元素设置样式（只复活自己）注意顺序不能颠倒，首先干掉其他人，再复活（设置）自己接下来看案例案例一：这一排5个按钮，只有在我点到哪个的时候哪个才变红，其他的都是默认样式。要实现这个效果，用css也可以实现，但今天我们用js中“排他思想”算法来实现它。代码如下：<!DOCTYPE html><html lang="en"> <head
复制链接

扫一扫