从 HTML 页面获取所有输入 ID 值

Question

我有一个包含一些输入文本的表单。他们每个人都有一个特定的 ID，我必须检索该 ID 才能进行特定的处理。

为此，我创建了一个基本的 JavaScript 来查询整个 HTML 文档。

window.addEventListener('load', function () {
    var inputs = [];
    document.querySelectorAll('input').forEach( input => {
        console.log(input.getElementsByTagName('id'));
        inputs.push(this);
    });

    console.log(inputs);
})

在这个阶段，我只是尝试将它们全部放在一个控制台中，然后将 id 推送到一个数组中。我会将它们添加到数组或其他内容中。我的问题是我获得了空的 HTML 集合和错误消息

TypeError：'caller'、'callee' 和 'arguments' 属性可能无法在严格模式函数或在 Function.invokeGetter 调用它们的参数对象上访问（： 2:14)

Answer 1

您可以在将其推入数组之前检查 id 属性。

请注意： Arrow function (=>) 没有它自己的 this。

window.addEventListener('load', function () {
  var inputs = [];
  document.querySelectorAll('input').forEach( input => {
    //console.log(this.constructor.name); // Window
    if(input.id)
     inputs.push(input.id);
  });
  console.log(inputs);
})

<input id="abc"/>
<input id="xyz"/>
<input />

从 HTML 页面获取所有输入 ID 值

Get all input id values from an HTML page

javascript

event-listener