<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. 通过四个问题了解HTTP协议基础

    很多人都知道学习和理解HTTP协议的重要性及必要性,但HTTP相关知识对计算机基础较差,尤其是我这种没有计算机基础的人来说更是晦涩难懂 乘着最近有空闲时间,开始恶补HTTP相关基础知识,下面请跟着我通 ...

  2. java8 List集合的排序，求和，取最大值，按照条件过滤

    public class Java8Test {       public static void main(String[] args) {           Person p1 = new Pe ...

  3. vue简介、入门、模板语法

    在菜鸟教程上面学习的vue.js.同时结合vue中文文档网站,便于自己记录. vueAPI网站:API 1. 简介 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框 ...

  4. logger.error打印完整的错误堆栈信息

    使用Spring Boot项目中的日志打印功能的时候,发现调用Logger.errror()方法的时候不能完全地打印出网站的错误堆栈信息,只能打印出这个错误是一个什么错误. 为什么呢,原因在于这个方法 ...

  5. 【02】Kubernets：使用 kubeadm 部署 K8S 集群

    写在前面的话 通过上一节,知道了 K8S 有 Master / Node 组成,但是具体怎么个组成法,就是这一节具体谈的内容.概念性的东西我们会尽量以实验的形式将其复现. 部署 K8S 集群 互联网常 ...

  6. 解决Web部署 svg/woff/woff2字体 404

    1.打开服务器IIS管理器,找到MIME类型 2.添加类型 文件扩展名      MIME类型 .svg             image/svg+xml.woff            appli ...

  7. C#获取剪切板的内容

    // GetDataObject获取当前剪贴板上的数据 IDataObject data = Clipboard.GetDataObject(); // 将数据与指定的格式进行匹配,返回bool if ...

  8. Web Api 模型绑定 一

    [https://docs.microsoft.com/zh-cn/aspnet/core/web-api/?view=aspnetcore-2.2]1.模型绑定 简单模型绑定针对简单类型(如stri ...

  9. vue+element 获取验证码

    我们在做一个项目,登录注册页面是少不了的,为了人机校验,验证码也是必须的 我的这个项目获取验证码,前端发送一个随机四位数给后端,后端返回一张图片,前端渲染就可以 template代码: <el- ...

  10. 不懂APS系统？十个问答让你对APS瞬间明明白白

    本文为您解答APS自动排程系统导入中客户常见的问题,帮助您评估企业是否适合导入APS,并了解需要的人力和资金的投入. Q1:哪些企业需要导入APS? A1: 编制生产计划有困难的企业都可以开始考虑导入 ...