原生js实现删除class和添加class
内容来自百度搜索
//判断样式是否存在
function hasClass(ele, cls) { return ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));}//为指定的dom元素添加样式function addClass(ele, cls) { if (!this.hasClass(ele, cls)) ele.className += " " + cls;}//删除指定dom元素的样式function removeClass(ele, cls) { if (hasClass(ele, cls)) { var reg = new RegExp("(\\s|^)" + cls + "(\\s|$)"); ele.className = ele.className.replace(reg, " "); }}//如果存在(不存在),就删除(添加)一个样式function toggleClass(ele,cls){ if(hasClass(ele,cls)){ removeClass(ele, cls); }else{ addClass(ele, cls); } }//调用function toggleClassTest(){ var ele = document. getElementsByTagName('body')[0]; toggleClass(ele,"night-mode"); } 原生js实现删除class和添加class的更多相关文章
- 原生js怎么删除一个 div
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 【学习】原生js学习笔记1:添加class和使input为不可用
<input type="checkbox" id="new_check" onChange="noUse()" checked> ...
- 原生js代码挑战之动态添加双色球
var ballArr = []; //存放已有的红球,用来排除重复和排序window.onload = function(){ var btn = document.createElement(&q ...
- 原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较
一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...
- jQuery和原生JS的对比
原生JS的缺点: 不能添加多个入口函数(window.onload),如果添加了多个,后面的会把前面的覆盖掉 原生js的api名字太长,难以书写,不易记住 原生js有的代码冗余 原生js中的属性或者方 ...
- 原生js添加和删除类
原生js添加和删除类: this.className +=" "; this.className = this.className.replace(" 原来的类" ...
- 原生JS动态添加和删除类
原生JS动态添加和删除类 由于需要, 给按钮组监听点击事件(要求用事件委托),当有一个按钮被点击时,相应的给该按钮添加一个类(激活类),其他没有点击的按钮就要移出该类 添加和和删除类有三种方法 首先等 ...
- 分别使用原生js和jQuery添加/删除元素的class属性
一.原生js添加/删除元素的class属性: <!-- span元素原有class = "test" --> <span class="test&quo ...
- 原生js实现类的添加和删除,以及对数据的add和update、view ,ajax请求 ,页面离开的操作
1 类操作 function hasClass(cla, element) { if(element.className.trim().length === 0) return false; var ...
随机推荐
- multiwan 脚本
以下为校区ACM实验室多拨脚本,使用了macvlan模块,具体策略路由和连接标记等思路就不解释了. #! /bin/bash getip() { |grep -o -e 'inet addr:[^ ] ...
- Java - day001 - 8种基本数据类型
一字节8电位 Java byte 最左边一位表示正负,0是正,1是负. (option / alt) + / 代码提示 Refactor 重构 Rename 重命名 (windows 重命名是选中 ...
- selenium对百度进行登录注销
#百度登录退出demo import time from selenium import webdriver from selenium.webdriver.common.action_chains ...
- CISPA Scyther tools
1.Scyther软件作者网站的整理 Scyther工具的网站主页:https://people.cispa.io/cas.cremers/index.html 首先 对Scyther软件的资料进行整 ...
- mycat+mysql集群:实现读写分离,分库分表
1.mycat文档:https://github.com/MyCATApache/Mycat-doc 官方网站:http://www.mycat.org.cn/ 2.mycat的优点: 配 ...
- STM32L1 串口相应驱动开发
初始化设置: GPIO_InitTypeDef GPIO_InitStructure; NVIC_InitTypeDef NVIC_InitStructure; USART_InitTypeDef U ...
- Linux cpu 内存 压力测试
stress --cpu 8 --io 4 --vm 2 --vm-bytes 128M --timeout 10s
- Redis实战 - 4.Key
Redis 键(key) Redis 键命令用于管理 redis 的键. DEL key 该命令用于在 key 存在时删除 key. 127.0.0.1:6379> set w3ckey red ...
- .Net Core Web/Console 下使用Nlog
.Net Core Console 下使用Nlog 官方介绍: https://github.com/NLog/NLog.Web/wiki/Getting-started-with-ASP.NET-C ...
- 关于WEB-INF目录下的静态资源(js、css、img)的访问
首先,需要明确的是WEB-INF目录是被保护起来的,其下的jsp页面不能直接运行,只能通过控制器跳转来访问:而同样在此目录下的静态资源(js.css.img)也不能被WEB-INF目录外的其他文件直接 ...