Создание объекта с использованием атрибутов отфильтрованного элемента в JavaScript

Благодаря ответам Аника и Джа, я смог объединить два и полностью выполнить то, что мне было нужно, код расширения выглядит следующим образом

jQuery.fn.objectFromFilter = function(f){
    var o = this.get();
    o = jQuery.map(o, function(q) {
        var o = {};
        for (var i = 0; i < f.length; i++){
            var a = q.getAttribute(f[i].a);
            if (typeof a !== typeof undefined && a !== false && a !== null)
                o[f[i].prop] = a;
        }
        return o;
    });
    return o;
};

И использование будет таким

var outObj = $('div.canvas > div[data-level="0"]').objectFromFilter([
    {attr: 'id', prop: 'id'}, 
    {attr: 'data-tag', prop: 'tag'}
]);
console.log(outObj);

Это может быть не быстро с хорошей производительностью, поскольку я не проверял это.

Попробуйте, это даст вам JSON-подобную структуру, которую вы ищете ...

        var arr = [];

        $('.canvas').find('div[data-level="0"]').each(function () {
            var $element = $(this);

            arr.push({
                id: $element.prop('id'),
                tag: $element.data('tag')
            });

        });

        console.log(arr);