js 点击不同li 切换颜色
html
<div>
<li class="m-li" id="" onclick='addColor(this.id)'>
会议简介
</li>
<li class="m-li" id="" onclick='addColor(this.id)'>
会议议程
</li>
<li class="m-li" id="" onclick='addColor(this.id)'>
会议嘉宾
</li>
</div>
js
function addColor(x)
{
let list=document.getElementsByTagName('li')
for(let p=list.length;p--;){
if(list[p].id!=x){
list[p].classList.remove("personal");
}
else {
/*点击的*/
list[p].classList.add("personal");
}
}
}
css
.personal {
color: #3A99FF;
}
js 点击不同li 切换颜色的更多相关文章
- 极简的js点击组图切换效果
程序员进行前端开发时,时常要用到点击切换组图的动画效果,网上确实有很多此类插件,但是都很麻烦,乌糟糟无数代码,有那个看的时间,自己都能把功能写完了.在这里我提供一段极简的js点击组图切换效果代码,包含 ...
- js 点击列表li,获得当前li的id
html <ul id="demo"> <li id="li-1">li1</li> <li id="li- ...
- JS点击更换网页背景颜色
JS部分 <script type="text/javascript"> // 定义可换的颜色 var colors = ["#ff0000", & ...
- 用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客
body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...
- 怎么用js设置a标签点击链接改变当前颜色
怎么用js设置a标签点击链接改变当前颜色 20 例如:多个a标签为白色,当点击其中一个a标签时改变那一个a标签的字体颜色为黄色,并且跳转到对应链接,当点击下一个a标签链接时,下一个为黄色,之前一个恢复 ...
- vue点击切换颜色限制个数(用了mui框架)
vue点击切换颜色 只能点击一个 <!doctype html> <head> <meta charset="UTF-8"> <title ...
- js如何实现动态点击改变单元格颜色?
js如何实现动态点击改变单元格颜色? 一.总结 1.通过table的rows属性,遍历表格所有行,然后通过cells属性,遍历每一行中的单元格. 2.遍历的过程中,动态的为每一个单元格定义单击事件,改 ...
- 使用jQuery实现点击左右滑动切换特效
使用jQuery实现点击左右滑动切换特效: HTML代码如下: <!--整体背景div--> <div class="warp"> <!--中间内容d ...
- js用户管理中心tab切换界面模板
效果体验:http://hovertree.com/texiao/js/27/ 效果图如下: 代码如下: <!DOCTYPE html> <html> <head> ...
随机推荐
- 对于MVVM的理解
MVVM 是Model-View-ViewModel的缩写. Model 代表数据模型,也可以在model中定义数据修改和操作的业务逻辑. View 代表UI组件,负责姜黄素局模型转化成UI展现出来. ...
- C++笔记(1)——Anniversary
世界太喧闹,不如敲代码. 直接上题目: Zhejiang University is about to celebrate her 122th anniversary in 2019. To prep ...
- python selenium API 常用方法
配置使用环境 下载相应的浏览器驱动, Firefox 是默认的 本文以 chrome 为主 ,放在scripts目录下ChromeDriver 官方下载地址 : 所有版本的 ChromeDriver ...
- DCN模型
1. DCN优点 使用Cross Network,在每一层都运用了Feature Crossing,高效学习高阶特征. 网络结构简单且高效 相比DNN,DCN的Logloss值更低,而且参数的数量少了 ...
- python装饰器的原理
装饰器的原理就是利用<闭包函数>来实现,闭包函数的原理就是包含内层函数的return和外层环境变量:
- MySql在win10上的安装(压缩版)
一.下载: 二.下载zip版,免安装版的. 三.解压缩后,注意:文件夹名称不能包含[空格] C:\MySQL 四.增加环境变量 五.手动在安装目录 C:\MySQL 下新建一个my.ini写入以下内 ...
- ZooKeeper的ACL权限
ACL控制权限 什么是ACL(Access Control List访问控制列表) 针对节点可以设置相关读写等权限, 目的为了保障数据安全性 权限permission可以指定不同的权限范围以及角色 A ...
- 14、PCA分析
做芯片PCA主成分分析可以选择使用affycoretools包的plotPCA方法,以样品"GSM363445_LNTT.CEL"."GSM362948_LTT.CEL& ...
- redis 学习(4)-- 哈希类型
redis 学习(4)-- 哈希类型 介绍 redis 中哈希键值结构: 可以看出:哈希键值包括 key,field,value 这三部分,即键,属性,值这三部分.可以这样来表示: key, (fie ...
- 什么是blazor
blazor是一个微软推出的基于webassembly和C#(面向对象) 以及F#(面向函数)的前端框架 它类似vue react anglar的单页前端框架 只是他不再使用js 或typescrip ...