function getElementsByClassName(className,root,tagName) { //root:父节点,tagName:该节点的标签名。 这两个参数均可有可无 if(root){ root=typeof root=="string" ? document.getElementById(root) : root; }else{ root=document.body; } tagName=tagName||"*"; if (document.getElementsByClassName) { //如果浏览器支持getElementsByClassName,就直接的用 return root.getElementsByClassName(className); }else { var tag= root.getElementsByTagName(tagName); //获取指定元素 var tagAll = []; //用于存储符合条件的元素 for (var i = 0; i < tag.length; i++) { //遍历获得的元素 for(var j=0,n=tag[i].className.split(' ');j<n.length;j++){ //遍历此元素中所有class的值,如果包含指定的类名,就赋值给tagnameAll if(n[j]==className){ tagAll.push(tag[i]); break; } } } return tagAll; } } function hasClass( elements,cName ){ return !!elements.className.match( new RegExp( "(\\s|^)" + cName + "(\\s|$)") ); // ( \\s|^ ) 判断前面是否有空格 (\\s | $ )判断后面是否有空格 两个感叹号为转换为布尔值 以方便做判断 }; 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|$)" )," " ); // replace方法是替换 }; };
原生js 实现addclass和removeclass
最新推荐文章于 2023-10-25 17:20:34 发布