>웹 프론트엔드 >JS 튜토리얼 >네이티브 자바스크립트는 addClass, RemoveClass, hasClass 기능을 구현합니다_javascript 기술

네이티브 자바스크립트는 addClass, RemoveClass, hasClass 기능을 구현합니다_javascript 기술

WBOY
WBOY원래의
2016-05-16 15:13:501201검색

原生的addClass, removeClass, hasClass函数,未使用jquery

class.js

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};

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.