window.onload=function () {
var oDiv=document.getElementsByTagName('div')[0];
var oInP=document.getElementsByTagName('input')[0];
var aDiv=new classList(oDiv);
oInP.onclick=function(){
aDiv.add('ha');
alert(oDiv.className);
}
}
/*
如果e有classList属性则返回它,否则,返回一个为e模拟DOMTOkenList API的对象
返回的对象有contains(),add(),remove(),toggle()和toString()等方法
来检测和修改元素e的类集合,如果classList属性是原生支持的。
返回的类数组对象有length和数组索引属性。模拟DOMTokenList不是类数组对象
但是它有一个toArray()方法来返回一个含元素类名的纯数组快照
*/
function classList(e){
//如果e.classList存在,则返回它
if (e.classList) {return e.classList;}
//否则,就伪造一个
else return new CSSClassList(e);
}
//CSSClassList是一个模拟DOMTOkenList的javascript类
function CSSClassList(e){this.e=e;}
//如果e.className包含类名c则返回true,否则返回false
CSSClassList.prototype.contains=function(){
//检查c是否合格类名,=-1代表找不到
if(c.length==0||c.indexOf(" ")!=-1)
throw new Error("Invalid calss name:"+c+"'");
var classes=this.e.className;
if(!classes) return false;
//e不含类名
if(classes===c)return true;
//e有一个完全匹配的类名
return classes.search("\\b"+ c +"\\b")!=-1;
};
//如果c不存在,将c添加到e.className中
CSSClassList.prototype.add=function(c){
if(this.contains(c)) return;
var classes=this.e.className;
if(classes&&classes[classes.length-1]!=" ")
c=" "+c;
this.e.className+= c;
};
//将在e.className中出现的所有的c删除掉
CSSClassList.prototype.remove=function(c){
if(c.length==0||c.indexOf(" ")!=-1)
throw new Error("Invalid calss name:"+c+"'");
var pattern=new RegExp("\\b"+ c +"\\b\s*","g");
this.e.className=this.e.className.replace(pattern,"");
};
//如果c不存在,将c添加到className中,并返回true;
//否则,将在e.className中出现的所有c都删除,并返回fasle
CSSClassList.prototype.toggle=function(c){
if(this.contains(c)){this.remove(c);return false;}
else{this.add(c);return true;}
};
//返回e.className本身
CSSClassList.prototype.toString=function(){
return this.e.className;
}
//返回在e.className中的类名
CSSClassList.prototype.toArray=function()
{return this.e.className.match(/\b\w+\b/g)||[];};

classLIST元素增删改查方法的更多相关文章

  1. Spring Data CrudRepository增删改查方法(八)

    CrudRepository   的主要方法 long count(); boolean exists(Integer arg0); <S extends StudentPO> S sav ...

  2. Django REST framework 五种增删改查方法

    Django-DRF-视图的演变   版本一(基于类视图APIView类) views.py: APIView是继承的Django View视图的. 1 from .serializers impor ...

  3. 通用mapper的增删改查方法 留存 备忘

    Mybatis通用Mapper介绍与使用   前言 使用Mybatis的开发者,大多数都会遇到一个问题,就是要写大量的SQL在xml文件中,除了特殊的业务逻辑SQL之外,还有大量结构类似的增删改查SQ ...

  4. 关于单链表的增删改查方法的递归实现(JAVA语言实现)

    因为在学习数据结构,准备把java的集合框架底层源码,好好的过一遍,所以先按照自己的想法把单链表的类给写出来了; 写该类的目的: 1.练习递归 2.为深入理解java集合框架底层源码打好基础 学习的视 ...

  5. js 增删改查方法

    push() 向数组的末尾添加一个或多个元素 pop() 删除数组内部并返回数组的最后一个元素 shift() 把数组内部的第一个元素从其中删除,并返回第一个元素的值 unshift() 向数组外部的 ...

  6. PHP历程(封装的增删改查方法)

    db.class.php   主要方法 <?php /** * 数据库配置信息 */ define('DB_HOST','127.0.0.1'); //服务器 define('DB_USER', ...

  7. Hibernate常用增删改查方法

    /** * @param obj * @return * 添加数据 */ public Serializable saveObject(Object obj){ return this.getHibe ...

  8. 连接SQLServer的增删改查方法代码

    在Visual C++中用ADO进行数据库编程 1. 生成应用程序框架并初始化OLE/COM库环境 创建一个标准的MFC AppWizard(exe)应用程序CADOConnection,然后在使用A ...

  9. ArrayList集合的增删改查方法

    新建一个myArrayList项目 在myArrayList项目下创建一个包 包中创建一个ArrayListDemo2.java文件 ArrayListDemo2.java import java.u ...

随机推荐

  1. Orcle数据库 表的 内置函数 内链接 外连接 相关练习题

  2. video 手机全屏自动播放

    <video src="video.mp4" id="video" x-webkit-airplay="true" webkit-pl ...

  3. java 垃圾回收

    转自:http://www.360doc.com/content/13/0305/10/15643_269388816.shtml

  4. MySQL 安装 + 精简 + 配置

    MySQL 安装 + 精简 + 配置 下载安装 从官网 下载 Community Edition MySQL 5.6 版本 精简 根目录下只留 [data/bin/share] , my-defaul ...

  5. HDU1760 A New Tetris Game NP态

    A New Tetris Game Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others ...

  6. OpenLayers2.13.1知识整理

    对于地图的默认加载等,网上很多资料,就不细说了,主要整理解决一些api不明显或不全的内容 因玩webgis只有一周左右,肯定很水~~ 我资料中的目录结构如下: html map js(自己封装的js目 ...

  7. 查找二维数组list[][]中的最大的子数组的和

    之前做过最大一维数组子数组的和的题目,现在将数组扩展成二维: 代码如下: #include<iostream> #define null -858993460 using namespac ...

  8. quick3.5 removeFromParent()导致的windows下模拟器崩溃问题

    今天遇到一个问题,点击一个按钮,这个按钮所在的layer从scene移除: local click = function ( event ) local StartScene=require(&quo ...

  9. json提交数据到服务端

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Courier New"; color: #393939; backgr ...

  10. Selenium碰到的异常记录

    .markdown-preview:not([data-use-github-style]) { padding: 2em; font-size: 1.2em; color: rgb(171, 178 ...