jquery - jquery重命名所有属性

Question

可能重复：
如何使用 jQuery 更改 HTML 属性名称？

我有一个大/复杂的表格，其中包含基于先前选择的问题的不同可用问题。

为了尽量保持井井有条，我有一些相同名称的重复输入。这会产生问题，即使页面下方的输入被隐藏，也会覆盖可见输入。

为防止这种情况，我已将所有隐藏输入设置为data-name而不是name属性。

问题 如何更改属性名称。例如：

<input data-name="phone" value="" />
<input data-name="email" value="" />

To
<input name="phone" value="" />
<input name="email" value="" />

Answer 1

$('input[data-name]').each(function(){
    $(this).attr('name', $(this).attr('data-name')); //does the switch
    $(this).removeAttr('data-name'); //clears out the old one if you need to
});

Answer 2

鉴于上述 HTML 标记，我建议：

$('input').each(
    function(i,el){
        var data = $(el).data();
        for (datum in data) {
            if (!el[datum]) {
                el[datum] = data[datum];
                el.removeAttribute('data-' + datum);
            }
        }
    });​

JS 小提琴演示。

这使用 jQuerydata()方法创建一个对象，其中包含数据（如果存在）附加到该方法正在迭代的当前 jQuery 对象each()。

实际上，在上面的示例中，if检查当前元素是否还没有同名的属性（因此name如果它已经存在则不会被覆盖），如果它不存在，则创建该属性/财产。

要显式覆盖预先存在的属性：

$('input').each(
    function(i, el) {
        var data = $(el).data();
        for (datum in data) {
            el[datum] = data[datum];
            el.removeAttribute('data-' + datum);
        }
    });​

JS 小提琴演示。

参考：

• data().
• each().
• removeAttribute().