js实现addClass,removeClass,hasClass的函数代码
function hasClass(ele,cls) {
return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
}
function addClass(ele,cls) {
if (!this.hasClass(ele,cls)) ele.className += " "+cls;
}
function removeClass(ele,cls) {
if (hasClass(ele,cls)) {
var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
ele.className=ele.className.replace(reg,' ');
}
}
//call the functions
addClass(document.getElementById("test"), "test");
removeClass(document.getElementById("test"), "test")
if(hasClass(document.getElementById("test"), "test")){//do something};
相关推荐
-
用原生JS获取CLASS对象(很简单实用)
听说是最常用....我是看了dom编程艺术想到的. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta
-
js判断样式className同时增加class或删除class
复制代码 代码如下: function MyClass () {} MyClass.hasClassName = function(element, className) { if (!element) return; var elementClassName = element.className; if (elementClassName.length == 0) return false; //用正则表达式判断多个class之间是否存在真正的class(前后空格的处理) if (eleme
-
JavaScript ES6中CLASS的使用详解
前言 对于javascript来说,类是一种可选(而不是必须)的设计模式,而且在JavaScript这样的[[Prototype]] 语言中实现类是很蹩脚的. 这种蹩脚的感觉不只是来源于语法,虽然语法是很重要的原因.js里面有许多语法的缺点:繁琐杂乱的.prototype 引用.试图调用原型链上层同名函数时的显式伪多态以及不可靠.不美观而且容易被误解成"构造函数"的.constructor. 除此之外,类设计其实还存在更进一步的问题.传统面向类的语言中父类和子类.子类和实例之间其实是复
-
javascript getElementsByClassName函数
今天在网上看到的一个根据ClassName获取Elements的脚本,在此记录一下,以便日后使用. 复制代码 代码如下: var getElementsByClassName = function(searchClass, node, tag) { if (document.getElementsByClassName) { return document.getElementsByClassName(searchClass) } else { node = node || document;
-
JavaScript更改class和id的方法
是className,可不是class 注意JavaScript使用的是className去访问class属性,因为class是一个保留关键字,因为将来JavaScript可能开始支持像Java一样的类. 我们在讨论style属性时遇到了棘手的细节问题和浏览器差异性带来的麻烦,正如同经历一场惊涛骇浪.而class和id的更改则像是沙漠里一片平静的绿洲,浏览器们在这里和谐相处.思考这个例子: p { color: #000000; /* black */ } p.emphasis { color:
-
js获取某元素的class里面的css属性值代码
用js如何获取div中css的 margin.padding.height.border等.你可能说可以直接用document.getElementById("id").style.margin获取.但是你说的只能获取直接在标签中写的style的属性,无法获取标签style外的属性(如css文件中的属性).而下面方法则两者值都可以获取.实例效果图如下: js在获取css属性时如果标签中无style则无法直接获取css中的属性,所以需要一个方法可以做到这点.getStyle(obj,at
-
js中设置元素class的三种方法小结
一.el.setAttribute('class','abc'); 复制代码 代码如下: <!DOCTYPE HTML> <HTML> <HEAD> <meta charset="utf-8" /> <title>setAttribute('class', 'abc')</title> <style type="text/css"> .abc { background: red; }
-
js获取class的所有元素
复制代码 代码如下: <html><head><script type="text/javascript"> window.onload = function(){ var topMenus = getClass('li','topMenu'); for(var i=0;i < topMenus.length; i++) { alert(topMenus[i].innerHTML); } }
-
JavaScript ES6的新特性使用新方法定义Class
ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony(和谐之意,显然没有跟上我国的步伐,我们已经进入中国梦版本了).上一次标准的制订还是2009年出台的ES5.目前ES6的标准化工作正在进行中,预计会在14年12月份放出正式敲定的版本.但大部分标准已经就绪,且各浏览器对ES6的支持也正在实现中. ES6中定义类的方式, 就是ES3和ES5中定义类的语法糖,虽然也有些区别,但是整体定义类的方式更加简洁,类的继承更加方便, 如果想对ES6中的继承更加
-
原生js实现查找/添加/删除/指定元素的class
复制代码 代码如下: window.onload = function(){ var gaga = document.getElementById( "gaga" ); addClass( gaga,"gaga1" ) addClass( gaga,"gaxx" ); removeClass( gaga,"gaga1" ) removeClass( gaga,"gaga" ) function hasCla
随机推荐
- js模拟百度模糊搜索的实例
- IE里button设置border:none属性无效解决方法
- utf8和unicode编码究竟是什么关系?有何区别?
- javascript 拖放效果实现代码
- Linux下编译安装python3步骤
- iOS开发之UITableView与UISearchController实现搜索及上拉加载,下拉刷新实例代码
- python开发之thread实现布朗运动的方法
- .Net获取URL中文参数值的乱码问题解决方法总结
- PHP数组中头部和尾部添加元素的方法(array_unshift,array_push)
- python使用matplotlib绘制柱状图教程
- GO语言文件的创建与打开实例分析
- Android项目实战手把手教你画圆形水波纹loadingview
- Android开发之文件操作详解
- c#程序员对TypeScript的认识过程
- PHP使用自定义方法实现数组合并示例
- SQL Server 2016 TempDb里的显著提升
- SQL Server FileStream详解
- Jquery获取和修改img的src值的方法
- javascript函数库-集合框架
- 免费空间广告万能消除代码