原生js实现类名(class)的增、删
先判断是否有这个类名:
function hasClass( elements,cName ){
return !!elements.className.match( new RegExp( "(\\s|^)" + cName + "(\\s|$)") );
};
或者:
利用this.getAttribute('class').indexOf('selected') > -1来判断;
增加类名:
function addClass( elements,cName ){
if( !hasClass( elements,cName ) ){
elements.className += " " + cName;
};
};
删除类名:
function removeClass( elements,cName ){
if( hasClass( elements,cName ) ){
elements.className = elements.className.replace( new RegExp( "(\\s|^)" + cName + "(\\s|$)" ), " " );
};
};
原生js实现类名(class)的增、删的更多相关文章
- 原生js 操作类名
添加类名: document.getElementById('navBar').getElementsByClassName('mui-tab-item')[0].classList.add('mui ...
- 原生js添加类名,删除类名
1.添加类名: document.getElementById("myDiv").classList.add('mystyle'); 2.删除类名: document.getEle ...
- 原生JS添加类名 删除类名
为 <div> 元素添加 class: document.getElementById("myDIV").classList.add("mystyle&quo ...
- 原生js操作类名
- 原生JS通过类名(className)获取dom元素
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- javascript 原生js对html元素的 增删改查 操作
'use strict'; class View{ constructor(){ } //创建html元素 addEl(fel, elemName, id, cls){ //创建一个元素 let el ...
- 抛开jQuery,拾起原生JS的DOM操作
常用的JS-DOM操作与jQuery的对比 jQuery用多了,还是需要来熟练熟练原生JS的操作,不然写JS都快离不开jQuery了 目录 1. 获取DOM 2. 创建DOM 3. 添加DOM 4. ...
- 常用原生JS方法总结(兼容性写法)
经常会用到原生JS来写前端...但是原生JS的一些方法在适应各个浏览器的时候写法有的也不怎么一样的... 今天下班有点累... 就来总结一下简单的东西吧…… 备注:一下的方法都是包裹在一个EventU ...
- 原生js实现autocomplete插件
在实际的项目中,能用别人写好的插件实现相关功能是最好不过,为了节约时间成本,因为有的项目比较紧急,没充分时间让你自己来写,即便写了,你还要花大量时间调试兼容性.但是出于学习的目的,你可以利用闲暇时间, ...
随机推荐
- MySQL表级约束和列级约束
对一个数据列建立的约束,称为列级约束 对多个数据列建立的约束,称为表级约束 列级约束即可以在列定义时生命,也可以在列定义后声明. 表级约束只能在列定义后声明. NOT NULL和DEFAULT只存在列 ...
- Mongodb定时备份脚本和清除脚本
Mongodb用的是可以热备份的mongodump和对应恢复的mongorestore,在linux下面使用shell脚本写的定时备份,代码如下 1.定时备份 #!/bin/bash sourcepa ...
- maven打包报错 ERROR: No goals have been specified for this build. You must specify a valid lifecycle phase or a goal in the format <plugin-prefix>:<goal> or <plugin-group-id>:<plugin-artifact-id
打开pom.xml 在build标签中 增加 <defaultGoal>compile</defaultGoal> 如下: <build><defaultGo ...
- 【ES6】var、let、const三者的区别
首先,一个常见的问题是,ECMAScript 和 JavaScript 到底是什么关系? ECMAScript是一个国际通过的标准化脚本语言.JavaScript由ECMAScript和DOM.BOM ...
- preg_match()——php
第一,让我们看看两个特别的字符:‘^’和‘$’他们是分别用来匹配字符串的开始和结束,以下分别举例说明: "^The": 匹配以 "The"开头的字符串; &qu ...
- linux压缩和解压缩命令大全[转]
.tar 解包:tar zxvf FileName.tar 打包:tar czvf FileName.tar DirName ------------------------------------- ...
- spring-boot之简单定时任务
首先是pom.xml依赖: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http:/ ...
- 十二 Cent OS下 tomcat启动项目响应速度很慢
在tomcat部署了web项目,每次启动项目都需要花费2-3分钟,甚至有的时候需要花费10分钟左右,实在是太慢了. 在网上查找解决方案,把 jdk/jre/lib/security/java.secu ...
- Python基础学习总结(二)
2.列表简介 Python有内置的一种数据类型列表:list. list是一种有序的集合. 列表由一系列按特定顺序排列的元素组合.用方括号 [ ] 来表示. list里面的元素的数据类型可以不同,比如 ...
- 【原创】MapReduce程序如何在集群上执行
首先了解下资源调度管理框架Yarn. Yarn的结构(如图): Resource Manager (rm)负责调度管理整个集群上的资源,而每一个计算节点上都会有一个Node Manager(nm)来负 ...