Question

我有一些选择器形式的CSS类，例如.myclass.myclass2，我想将这两个类应用于元素。

我可以.split()字符串并使用.addClass()应用每个类，但在此之前，我想知道是否有“本机”jQuery函数来执行此类操作或者有人写了一个处理它的功能。

为了更好地解释：我想要一个函数，我可以将它传递给CSS选择器，它会将类添加到元素中。与$('#myelem').addClass('.myclass.myclass')一样。

（我也很喜欢它处理其他CSS选择器，例如#myid，但我担心这会要求太多，我可能需要一个完整的解析器函数。）

Answer 1

addClass采用空格分隔的字符串，因此您需要做的就是用空格替换点：

var classes = '.myclass.myclass2';
$(element).addClass(classes.replace(/\./g,' ').trim()))

Answer 2

在样式标记内创建两个类，如此

        .a {
       backgroud-color:red;
       }
     .b{
       color:blue; 
       }
      </style>

现在添加你的jquery代码

然后在javascript代码中

       <script type="text/javascript">

       $(document).ready(function(){

      $('#mydiv').addClass(a).addCLass(b);

或

     $("#mydiv").addClass({a,b});

或

      $('#mydiv').addClass(a);
  $('#mydiv').addClass(b);



     });
     </script>

这是html

          <html>
       <body>
                 <div id="mydiv"></div>
              </body>
                  </html>

Answer 3

您可以将其添加到您的脚本中：

$.fn.oldAddClass = $.fn.addClass;
$.fn.addClass = function(x){
    if(typeof x == 'string'){
        this.oldAddClass(x.replace(/\./g, ' '));
    }else{
        this.oldAddClass(x);
    }
}

然后用你的点号呼叫addClass()：

$(el).addClass('.class1.class2');

小提琴：http://jsfiddle.net/8hBDr/

Answer 4

您无法将css选择器（如#elemid.myclass）直接添加到本机jQuery中的元素。下面的示例显示了如何使用空格分隔的字符串添加多个类。

$(elem).addClass("myclass mycalss2")

文档： http://api.jquery.com/addClass/

如何从选择器字符串添加类？

4 个答案: