javascript - 从具有相同前缀的数据属性中获取所有键/值对

Question

我正在一个平台上工作，并希望统一和标准化整个平台的某些行为...... html 元素中的 data- 属性将发挥重要作用......

所以假设我有一个按钮：

<a href="..." class="btn" data-tip="My button" data-modal_tile="Foo" data-templade_data_id="14" data-templade_data_action="reset">...</a>

现在，我的 Javascript 处理这个按钮的行为。

我想要设置一个 template_data 数组，这将为我提供 data- 属性中具有相同前缀（data-template_data_）的所有键/值对......所以在我的示例中，我会得到：

{
    id: "14",
    action : "reset"
}

最好的方法是什么？

Answer 1

试试这个

var array = [];
$( ".btn" ).each( function(){
    var obj = {};
    $.each(this.attributes, function() 
    {
        if(this.name.indexOf( "data-templade_data_" ) == 0 ) 
        {
            var key = this.name.replace( "data-templade_data_", "" );
            obj[ key ] = this.value;
        }
    });
    array.push( obj );
} );

Answer 2

这对我有用

jQuery.fn.extend({
hyphened: function(prefix) { // prefix = data or myplugin
    var attributes = {};
    $.each(this.get(0).attributes, function(index, attrib) {
        if(attrib.name.indexOf(prefix+"-")==0) {
            var key = attrib.name.replace(prefix+"-","");
            attributes[key] = attrib.value;
        }
    });

    return attributes;
}

});