javascript - 如何在html输入中编写名称和id值相同属性的快捷方式？

Question

<input type="text" id="motto" name="motto" value="">

与其写这么长，我可以有一些nameid="motto"吗？
如何在 javascript 中执行此操作？我以前一直在用 php 中的一个函数来做这个，只是好奇是否有可用的 javascript 解决方案。

Answer 1

nameidHTML 规范中没有定义这样的参数。因此，虽然您可以使用 javascript 实现这一点，但您首先会得到损坏的 HTML。我不建议你走那条路，但如果你决定违背我的建议并渲染损坏的标记，你可以用 jQuery 做：

$(function() {
    $('input').each(function() {
        var nameid = $(this).attr('nameid');
        $(this).attr('id', nameid).attr('name', nameid);
        $(this).removeAttr('nameid');
    });
});

Answer 2

你的意思是在HTML中有一个nameid属性并在页面加载时用JavaScript修复它？

Array.prototype.forEach.call( // for each
    document.querySelectorAll(*[nameid]), // element with this attribute
    function (e) { // do
        var v = e.getAttribute('nameid'); // get the value
        e.setAttribute('id', v); // set id
        e.setAttribute('name', v); // set name
        e.removeAttribute('nameid'); // remove it
    }
);

您应该知道任何具有此nameid属性的 HTML 都是无效的。

Answer 3

只需设置 ID，您可以将其放入您的 javascript 中以将名称设置为相同：

$('input[id]').each(function() { $(this).attr("name", this.id); });