Используйте jQuery для получения списка классов

У меня есть неупорядоченный (ul) HTML-список. Каждый элемент li имеет к нему 1 или более классов. Я хочу пройти через этот список ul и получить все (разные) классы. Затем из этого списка создайте список флажков, значение которых соответствует значению класса, а также чей знак соответствует классу. Один флажок для каждого класса.

Каков наилучший способ сделать это с помощью jQuery?

Ответ 1

Попробуйте следующее:

// get the unique list of classnames
classes = {};
$('#the_ul li').each(function() {
    $($(this).attr('class').split(' ')).each(function() { 
        if (this !== '') {
            classes[this] = this;
        }    
    });
});

//build the classnames
checkboxes = '';
for (class_name in classes) {
    checkboxes += '<label for="'+class_name+'">'+class_name+'</label><input id="'+class_name+'" type="checkbox" value="'+class_name+'" />';
};

//profit!

Ответ 2

Мне также нужна эта функциональность, но, как плагин, я думал об этом...

jQuery.fn.getClasses = function(){
  var ca = this.attr('class');
  var rval = [];
  if(ca && ca.length && ca.split){
    ca = jQuery.trim(ca); /* strip leading and trailing spaces */
    ca = ca.replace(/\s+/g,' '); /* remove doube spaces */
    rval = ca.split(' ');
  }
  return rval;
}