js 循环点击事件 改变背景颜色

最新推荐文章于 2022-08-19 00:08:26 发布
最新推荐文章于 2022-08-19 00:08:26 发布
阅读量3.2k 收藏 2
点赞数 2
分类专栏： js jquery 文章标签： js 循环点击事件
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Nicholas_long/article/details/81948764
版权
js 同时被 2 个专栏收录
10 篇文章 0 订阅
订阅专栏
jquery
8 篇文章 0 订阅
订阅专栏

老规矩先看效果:

这里使用的ul li标签这里就不上代码了很简单 下面就是重要部分：

使用的js获取id下li标签的长度当然你也可使用jquery 不做过多的讲解一目了然

叫我阿龙啊
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
循环列表中点击更改当前项的字体颜色
weixin_45301448的博客
01-08 907
方法一 <!-- index.wxml --> <view class='top'> <view class="{{ currentTab == index ? 'active' : '' }}" wx:for="{{top}}" wx:key="{{lalala}}" bindtap="{{ currentTab != index ? 'navbarTap':'...
js-实现点击循环变色问题
老衲的少女心i~
03-31 1559
代码如下： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js-点击循环变色事件</title> <style> #box { width: 200px; height: 200px; background-color: pink; cu
js点击的时候变颜色怎么做？
kakaxiD的博客
04-06 3584
<script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> <style> .current{background:#efd060;} </style> <ul class="toolbar"> <li class="click"> &nb
前端应用_js_利用for循环批量更改背景色
上海 彭彭
08-03 1550
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>相加</title> <style type="text/css"> .box{ width:300px; ...
原生JS总结1------操作遍历的dom元素时需要注意的事
web开发
11-02 600
最近研究了下原生js，发现其中的地雷很多。以前的时候每次写js只用借助于jquery这种js框架来写，所以每次写完之后都觉得很方便，而且很快，不用考虑过多的兼容性处理问题。但是最近觉得还是得研究下原生js，就用原生js写了两个小游戏，收获颇多。（下面会将两个游戏的代码放上去：贪吃蛇和扫雷） 原生js在获取dom元素时，除了document.getElementById()外，其他的...
vue实现点击按钮切换背景颜色的示例代码
10-15
在Vue.js中，我们可以轻松地实现点击按钮切换背景颜色的功能。这个功能主要依赖于Vue的数据绑定和事件处理机制。以下是对给定代码的详细解释： 1. **数据绑定**：在Vue中，我们使用`v-bind`指令来绑定HTML元素的...
js实现点击按钮随机生成背景颜色
10-14
在JavaScript中，我们可以利用事件监听和数学方法来实现点击按钮后随机生成背景颜色的功能。以下是对给定的标题、描述和代码内容的详细解释： ### 随机颜色生成原理 随机生成背景颜色的核心在于创建一个十六进制...
JavaScript实现点击按钮切换网页背景色的方法
10-23
标题中的“JavaScript实现点击按钮切换网页背景色的方法”是指通过编写JavaScript代码，使得用户点击页面上的按钮时，能够动态地更改网页的背景颜色。这个功能是网页交互性的一个常见示例，它涉及到JavaScript的事件...
js点击列表文字对应该行显示背景颜色的实现代码
12-10
本文将详细介绍如何使用JavaScript实现这个功能，特别是在网页列表中点击文字后改变对应行的背景颜色。 首先，我们需要在CSS中定义两个样式类。第一个是通用的列表项样式`li`，我们可以为其设置鼠标指针样式`cursor...
用CSS JS控制Li背景颜色交替.rar
07-05
这个"用CSS JS控制Li背景颜色交替"的主题就涉及到了如何使用CSS和JavaScript来实现这样的功能。首先，我们要理解CSS和JavaScript各自在网页样式和交互中的角色。 **CSS（层叠样式表）**是用于描述HTML或XML（包括如...
vue中v-for循环选中点击的元素并对该元素添加样式操作
11-20
相信大家都会遇到这种情况：v-for循环时，我只需要点击到的元素做出相应反应，其他的元素不变；但是往往所有v-for循环出的元素都会变化。如下面的代码：我需要点击到的元素添加一个类样式，其他元素不变，但是这样会导致所有的元素都会变化 html： {{item.name}} css： .addclass{ color : red; } js： data:{ items :[
js 基础学习 遍历DOM
qq_40890601的博客
07-23 933
DOM这块知识很重要，做个总结吧！ DOM 表示文档对象模型，每个HTML标签都是一个对象，标签内的文本也是对象，所有这些对象都可以使用 js 来访问和修改。 js 共有12 种节点类型 通常用到的有四种： document — DOM 的“入口点”。 元素节点 — HTML 标签，树构建块。 文本节点 — 包含文本。 注释 — 有时我们可以将一些信息放入其中，它不会显示，但 JS 可以从 DOM 中读取它。 自动修正 如果浏览器遇到格式不正确的HTML，它会在形成DOM的时候修正它。 例如，顶级标签永
原生js循环展示dom_复习Js:
weixin_39978749的博客
10-16 516
(谢谢观赏)为什么学习 JavaScript（作用）：1、html+css 只是可以实现静态的页面无法实现动态的效 果 2、表单的校验 3、背景图片的更换 4、操作节点的信息JavaScript 的概念：JavaScript 一种直译式脚本语言，是一种动态类型、弱类型、 基于原型的语言，内置支持类型JavaScript 组成：ECMAScript：JavaScript的核心 文档对象模型（DOM）...
js随机改变颜色
majic_Jing的博客
10-07 2080
目的：用js将页面设置成随着鼠标点击界面而随机改变颜色。 代码如下： <!DOCTYPE html> <html> <head> <title>随机改变页面颜色</title> <script type="text/javascript"> function changeBg() { //将背景颜...
javascript 背景和字体颜色自动变色
男儿当自强
09-19 4143
背景颜色：document.bgColor设定； 前景颜色：document.fgColor设定； <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> Insert title here var n=0; var arr=new Array("blue",
jquery实现点击按钮循环变色功能的3种方式
just_learing的博客
02-28 3072
点按钮换色 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> .changeRed{ background-color:red; } </style> </head> <body> <ul> <li &gt
CSS+JS实现文本隔行变色的几种方法
web 前端 基础记录
11-07 1489
隔行变色的九种实现方案 CSS+JS实现文本背景三行变色方案一：用CSS实现隔行变色==利用伪类选择器来实现文本背景隔行变色==JS方案：采用JS实现隔行变色方案二：for循环 > 遍历的数除以3 取余数 （模3）行内样式改变样式。方案三：for循环 > 遍历的数除以3 取余数 （模3）在style上面设置样式，在下面通过className，赋值标签名。方案四：switch循环 > style里面设置类名样式。.className方案五：三元运算 > 表达式1？ 表达
原生js循环写hover变色效果
qq_49277509的博客
07-11 830
前前前前端静静第六篇博客 最近开始重新复习js了，最近写了一个很小的demo，本来就css的hover属性就可以轻松搞定，奈何，高估了自己的能力，非用js去写hover事件，结果，出bug了，求助求助，在我的求助下，别人帮助我解决了这个问题，下面详细看看吧~~~~ 首先是我自己的小demo： 首先这个逻辑是：添加一个类名，鼠标移动上的时候就添加这个类名，鼠标不在这个元素上就移除类名，根据这个原理去进行变色的样子 css .active { background-color: rgb
js实现按钮点击变色，其他的按钮恢复默认颜色
热门推荐
异想实验室|Arduion|ESP8266|Micro Python|
08-19 1万+
JavaScript实现按钮点击变色，其他的按钮恢复默认颜色，则需通过循环实现，当有按钮点击的时候，先将所有的按钮的颜色，更改为空，然后在针对，鼠标点击的相应的按钮，进行更改按钮颜色；onclick实现按钮点击后的操作；...
js循环出来的td给其中一列的加点击事件
最新发布
10-01
使用JavaScript循环创建出的td，想要给其中一列的td加上点击事件，可以通过以下步骤实现: 1. 首先，给这一列的td设置...在示例代码中，注释部分展示了如何通过改变被点击的td元素的背景颜色来演示点击事件的处理逻辑。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值