首页 > 开发 > JS > 正文

jQuery 中关于CSS操作部分使用说明

2024-09-06 12:42:14
字体:
来源:转载
供稿:网友
刚刚看了下jQuery的源代码,其中关于CSS及className的操作思想确实很不错,值得借鉴。
其中关于jQuery.className.has的定义部分,是用的正则来实现的,其实此处直接利用Javascript中String对象的indexOf方法来作处理的话,比用正则效率会更些,因此 代码如下:
jQuery.className.has的定义可以改进成: 
    has: function( t, c ) { 
      t = t.className || t; 
      t = " " + t + " "; 
      c = " " + c + " "; 
      return t.indexOf(c)>-1; 
    } 

原代码中关于CSS及className的操作部分节选如下:
代码如下:
  className: { 
    // internal only, use addClass("class") 
    add: function( elem, c ){ 
      jQuery.each( c.split(//s+/), function(i, cur){ 
        if ( !jQuery.className.has( elem.className, cur ) ) 
          elem.className += ( elem.className ? " " : "" ) + cur; 
      }); 
    }, 

    // internal only, use removeClass("class") 
    remove: function( elem, c ){ 
      elem.className = c ? 
        jQuery.grep( elem.className.split(//s+/), function(cur){ 
          return !jQuery.className.has( c, cur );   
        }).join(" ") : ""; 
    }, 

    // internal only, use is(".class") 
    has: function( t, c ) { 
      t = t.className || t; 
      // escape regex characters 
      c = c.replace(/([/.///+/*/?/[/^/]/$/(/)/{/}/=/!/</>/|/:])/g, "//$1"); 
      return t && new RegExp("(^|//s)" + c + "(//s|$)").test( t ); 
    } 
  }, 
  swap: function(e,o,f) { 
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表