javascript – 使用jQuery根据div的多个属性动态创建复选框

jQuery(function ($) {

    function createcheckBoxes($els,attr) {
        var props = {};
        $els.each(function () {
            props[$(this).attr(attr)] = true;
        });

        return $.map(props,function (val,key) {
            var $chk = $('<input />',{
                type: 'checkBox',value: key
            })
            return $('<label />',{
                text: key
            }).append($chk)
        })
    }

    $('span').append(createcheckBoxes($('div'),'class'))
    $('span').append(createcheckBoxes($('div'),'data-size'))
    $('span').append(createcheckBoxes($('div'),'data-color'))
});

演示：Fiddle