jQuery добавить класс, если он существует в другом месте

Question

Я только что написал код ниже, чтобы добавить класс в внешний div, где он совпадает. Теперь я знаю, что должен быть более элегантный способ достижения ниже!

if ($(".cur").hasClass("one")) { $("#outer").addClass("one"); } 
if ($(".cur").hasClass("two")) { $("#outer").addClass("two"); } 
if ($(".cur").hasClass("three")) { $("#outer").addClass("three"); } 
if ($(".cur").hasClass("four")) { $("#outer").addClass("four"); } 
if ($(".cur").hasClass("five")) { $("#outer").addClass("five"); } 
if ($(".cur").hasClass("six")) { $("#outer").addClass("six"); } 

Любые улучшения будут с удовольствием получил :)

Answer 1

var classNames = '';  
$('.cur').each(function(){ 
    if (classNames.indexOf(this.className + ' ') === -1) 
     classNames += this.className + ' '; 
}); 

var classes = classNames.split​(" ");​​​ 
var $outer = $('#outer');  
$.each(classes, function(index, value){ 
    if (value !== 'cur') 
     $outer.addClass(value); 
}); 

Live DEMO

Примечания:

• С помощью этого кода вы не должны "сжечь" классы .cur в коде, это делается автоматически ,
• Он скопирует все классы .cur (кроме cur), поэтому вам решать, хорошо ли это для вас или нет.

Answer 2

Как об этом:

var classes = ['one', 'two', 'three'], 
    $cur = $('.cur'), 
    $outer = $("#outer"); 

$.each(classes, function(i, v) { 
    if ($cur.hasClass(v)) $outer.addClass(v); 
}) 

или итерации могут быть реализованы в виде чистых JS, как:

for (var i in classes) { 
    var v = classes[i]; 
    .... 
} 

или (лучше) использовать for вместо:

var len = classes.length; 
for (var i = 0; i < len; i++) { 
    var v = classes[i]; 
} 

Answer 3

var classes = ['one', 'two', 'three', 'four', 'five', 'six']; 
$.each(classes, function(key, value){ 
    if($('.cur').hasClass(value)) $('.cur').closest('div').addClass(value); 
}); 

Должен сделать трюк, он использует ближайший ('div'), чтобы получить внешний div.

Answer 4

Это должно быть быстрее, так как он не вызывает .hasClass на каждой итерации:

// define which classes you want to match 
match_classes = ["one", "two", "three", "four"]; 
// grab all the classes on the inner element 
elm_classes = $(".cur").attr("class").split(" "); 
// cache the outer element for quick access 
$outer = $("#outer"); 

// iterate over the list of classes you want to match 
$.each(match_classes, function(i, val){ 
// if one of those classes exists on inner, add it to outer 
    if(elm_classes.indexOf(val) > -1) $outer.addClass(val); 
}); 

Answer 5

Вы можете найти класс соответствия с помощью Regex, а затем добавить класс соответствия для #outer. Смотрите ниже,

$(function() { 
    var regClasses = /(one|two|three|four|five|six)/g; 
    var $cur = $('.cur'), 
     $outer = $('#outer'); 

    $cur.each(function() {   
     $outer.addClass(this.className.match(regClasses).join(' ')); 
    }); 
}); 

DEMO