У меня есть динамически созданная <div/>
область, подобная этой
<div class="canvas">
<div id="1" data-level="0" data-tag="a"></div>
<div id="2" data-level="0" data-tag="b">
<div id="3" data-level="1" data-tag="b">
<div id="4" data-level="2" data-tag="a"></div>
</div>
<div id="5" data-level="1" data-tag="a"></div>
</div>
<div id="6" data-level="0" data-tag="b"></div>
</div>
Я хочу создать объект для передачи вызова ajax, содержащего идентификаторы, теги и тексты для каждого <div/>
элемента с [level="0"]
.
Что-то вроде этого
var outObj = jQuery('div.canvas > div[level="0"]')
.objectFromFilter([
{attr: 'id', prop: 'id'},
{attr: 'data-tag', prop: 'tag'}
]);
console.log(outObj);
Это приведет к
[
{ id: "1", tag: "a" },
{ id: "2", tag: "b" },
{ id: 6, tag: "b" }
]
3 ответа
Вы можете сделать это, используя .map () .
Попробуйте вот так
var outObj = $('div.canvas > div[data-level="0"]').map(function() {
return {
id: $(this).attr("id"),
tag: $(this).data("tag")
};
});
console.log(outObj);
Благодаря ответам Аника и Джа, я смог объединить два и полностью выполнить то, что мне было нужно, код расширения выглядит следующим образом
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);
Похожие вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.