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> ...
随机推荐
- springboot mybatis 下使用注解组织查询语句(有查询条件传入)
@Select("<script>" + "select cab.brandpre_id,cab.brandpre_num_app,cab.id,cab.br ...
- open_basedir restriction in effect,解决php引入文件权限问题 解决方法
如下: 出现问题的原因: 查看问题描述以及资料,发现是php open_basedir 配置的问题,PHP不能引入其授权目录上级及其以上的文件: 一般情况下是不会出现这种问题的,之所以出现这个问题绝大 ...
- 【AMAD】dogpile.cache -- 一个Python缓存API,提供一套通用的接口来适配不同的缓存后端
简介 动机 作用 用法 个人评分 简介 Dogpile1由两套子系统组成,其中一个是基于另一个来构建的. dogpile提供了dogpile lock的概念,这个控制结构让一个线程可以被选为一些资源的 ...
- 二 MyBatis 从入门到进阶 2 Maven 入门
1 Maven 的使用 1.1 本地仓库与中央仓库 本地仓库:Window \ Preferences \ Maven \ User Settings \ Local Repository 中央仓库: ...
- Linux C/C++基础 文件(中)
1.ubuntu cat命令的实现 cat——查看或者合并文件内容 #include<stdio.h> int main(int argc,char* argv[]) { //1.打开文件 ...
- 【Linux开发】linux设备驱动归纳总结(四):3.抢占和上下文切换
linux设备驱动归纳总结(四):3.抢占和上下文切换 xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx ...
- 语言模型评价指标Perplexity
在信息论中,perplexity(困惑度)用来度量一个概率分布或概率模型预测样本的好坏程度.它也可以用来比较两个概率分布或概率模型.(应该是比较两者在预测样本上的优劣)低困惑度的概率分布模型或概率模型 ...
- jdbc简单使用
1.代码 import java.sql.*; public class DBUtil { public static void main(String[] args) throws ClassNot ...
- 从尾到头打印列表——牛客剑指offer
题目描述 输入一个链表,按链表值从尾到头的顺序返回一个ArrayList. 解题思路 思路1: 顺序遍历链表,取出每个结点的数据,插入list中. 由于要求list倒序存储链表中的数据,而我们是顺序取 ...
- python网络爬虫(3)python爬虫遇到的各种问题(python版本、进程等)
import urllib2 源地址 在python3.3里面,用urllib.request代替urllib2 import urllib.request as urllib2 import coo ...