<body>
    <button>按钮1</button>
    <button>按钮2</button>
    <button>按钮3</button>
    <button>按钮4</button>
    <button>按钮5</button>
</body>
<script>
    var btns = document.getElementsByTagName("button");
    for(var i = 0; i < btns.length;i++) {
     
       btns[i].onclick = function() {
        for(var i = 0;i<btns.length;i++) {
            btns[i].style.background = '';
        }
        this.style.backgroundColor = "pink";
       }
        
            
            
       
     }
    
</script>
先让所有的都没有,再设置自己的,这是排他思想的核心。

Js中的排他思想的更多相关文章

  1. 用jQuery实现轮播图效果,js中的排他思想

    ---恢复内容开始--- jQuery实现轮播图不用单独加载. 思路: a. 通过$("#id名");选择需要的一类标签,获得一个伪数组 b.由于是伪数组的原因,而对数组的处理最多 ...

  2. 谈一谈原生JS中的【面向对象思想】

           [重点提前说:面向对象的思想很重要!]         最近开始接触学习后台的PHP语言,在接触到PHP中的面向对象相关思想之后,突然想到之前曾接触的JS中的面向对象思想,无奈记性太差, ...

  3. js 排他思想案例

    <!-- 排他思想 --> <button>按钮1</button> <button>按钮2</button> <button> ...

  4. python 全栈开发,Day52(关于DOM操作的相关案例,JS中的面向对象,定时器,BOM,client、offset、scroll系列)

    昨日作业讲解: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉, ...

  5. 前端JavaScript(3)-关于DOM操作的相关案例,JS中的面向对象、定时器、BOM、位置信息

    小例子: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉,就可以 ...

  6. JS中的prototype

    JS中的phototype是JS中比较难理解的一个部分 本文基于下面几个知识点: 1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个 ...

  7. 【巩固】JS中的封闭空间

    封闭空间的主要思想在于: JS中给一个变量外面加小括号,是不改变任何结果的.比如 var show = function(){ //定义一个名字为show的函数 ); }; show(); //调用名 ...

  8. 在js中怎么样选择互斥的相邻元素

    在使用jquery中,我们通常会选择siblings()去选择相邻元素,使用eq()方法去匹配元素,使用index()获取对应元素的索引值,具体jquery代码如下: <style> *{ ...

  9. js中各种跨域问题实战小结(一)

    什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源策略 ...

随机推荐

  1. [转帖]Linux date命令的用法(转)

    Linux date命令的用法(转) https://www.cnblogs.com/asxe/p/9317811.html 1.命令:date 2.命令功能:date 可以用来显示或设定系统的日期与 ...

  2. Mysql系列(十二)—— 索引下推优化

    索引条件下推(ICP)是对MySQL使用索引从表中检索行的情况的优化.如果没有ICP,存储引擎会遍历索引以查找基表中的行,并将它们返回给MySQL服务器,该服务器会评估WHERE行的条件.启用ICP后 ...

  3. 2019-11-29-VisualStudio-断点调试详解

    原文:2019-11-29-VisualStudio-断点调试详解 title author date CreateTime categories VisualStudio 断点调试详解 lindex ...

  4. 在ASP.NET Core中添加的Cookie如果含有特殊字符,会被自动转义

    我们知道在Cookie中有些字符是特殊字符,这些字符是不能出现在Cookie的键值中的. 比如"="是Cookie中用来分隔键和值的特殊字符,例如:Key01=Value01,表示 ...

  5. EF core的原生SQL查询以及用EF core进行分页查询遇到的问题

    在用.net core进行数据库访问,需要处理一些比较复杂的查询,就不得不用原生的SQL查询了,然而EF Core 和EF6 的原生sql查询存在很大的差异. 在EF6中我们用SqlQuery和Exe ...

  6. 【转载】Gradle学习 第四章:安装Gradle

    转载地址:http://ask.android-studio.org/?/article/16 4.1. Prerequisites 前提条件Gradle requires a Java JDK or ...

  7. 203--Remove LinkedList Elements

    package LinedList; public class RemoveLinkedListElements { //解法一:循环 public ListNode removeElements(L ...

  8. python3做词云分析

    python3做词云 其实词云一般分为两种,一个是权重比,一个是频次分析 主要还是体现在自然语言方向,难度较大,但这里我们用jieba词库 主要思路, 后端算数据+前端生成图(D3-cloud-好像是 ...

  9. 不同平台下int类型、指针类型的数据大小

    不同平台下int类型.指针类型的数据大小 对于int类型数据和指针类型数据的大小,是非常基础的问题. 在一个具体的平台上,确定他们最好的办法就是使用sizeof(type)对其进行判断,返回当前数据类 ...

  10. 运用软链接,解决NBU默认安装目录空间不足

    建立软链接实例: 例如 /usr 剩余空间5G,/opt剩余空间100G 提前在通过如下命令在/opt 目录下创建openv文件夹 mkdir -p /opt/openv 然后进入 /opt/open ...