JS中获取DOM节点的类有3种方法:
1、classList
H5的方法,仅兼容IE10+,配套带有remove等api
2、getAttribute(‘class‘)
据说在低版本IE有兼容问题,建议用方法3
3、className
这个方法万能
其实要讲的是看到vue源码里面的一个方法,兼容IE9一个对类进行操作的方法。
记下来以后用。
// DOM节点与要删除的类 function removeClass(el, cls){ // 这里已经对cls调用了trim()方法 if(!cls || !cls = cls.trim()){ return ; } // classList兼容IE10+ // 如果支持 直接按空格分割字符串并调用remove方法删除类 if(el.classList){ if(cls.indexOf(‘ ‘) > -1){ cls.split(/\s+/).forEach(function(c){ return el.classList.remove(c); }); } else{ el.classList.remove(cls); } } // 对IE10以下做兼容 不知道为啥不用className else{ // 修正类集合字符串 两边加空白 // ‘a b‘ => ‘ a b ‘ var cur = ‘ ‘ + (el.getAttribute(‘class‘) || ‘‘) + ‘ ‘; // 修正目标类 ‘a‘ => ‘ a ‘ var tar = ‘ ‘ + cls + ‘ ‘; // 进行替换 ‘ a b ‘ => ‘ b ‘ while(cur.indexOf(tar) >= 0){ cur = cur.replace(tar, ‘ ‘); } // 再调用trim()操作 ‘ b ‘ => ‘b‘ el.setAttribute(‘class‘, cur.trim()); } }
时间: 2024-11-05 15:38:12