Question

如何提取具有特定数据属性的页面上的所有元素，并将结果转换为下拉列表。

这是我到目前为止所得到的：

<div data-position="first" data-section="Main Section"></div>
<div data-position="second" data-section="Sub Section"></div>
<div data-position="third" data-section="Footer Section"></div>

result = '';
result2 = '';
$('#content').each(function(){
    result += $(this).find('div[data-position]').data('position');
    result2 += $(this).find('div[data-section]').data('section');
})

想法是这样的：

<option value="first">Main Section</option>
<option value="second">Sub Section</option>
<option value="third">Footer Section</option>

Answer 1

$("#content div[data-position][data-section]").each(function() {
    var position = $(this).data('position');
    var section = $(this).data('section');
    $("#selectID").append($("<option>", {
        value: position,
        text: section
    });
});

Answer 2

字符串附加方法

$('div[data-position][data-section]').each(function(){
    var data = $(this).data(),
        option = '<option value="' + data.position + '">' + data.section + '</option>';
    $('#selectID').append(option);
});

jQuery查找包含特定数据属性的所有元素并转换为数组

2 个答案: