如何 select 相同标记但不同类的多个元素？使用香草 JS

Question

我在一个表单中有 6 个输入，每个输入的 class 分别为 .first .second .third .fourth .fifth .sixth 并且我想 select 它们与 vanilla JS但是在尝试了 getElementsByClassName 和 querySelectorAll 之后，仍然没有成功。

这是我的代码行：

document.querySelectorAll("form input")[0].value==""

我如何 select 所有元素与那些 classes？

在此先感谢您提供的任何帮助！

Answer 1

你只是 select 通过标签名称：

const elements = document.getElementsByTagName("input")

https://developer.mozilla.org/en-US/docs/Web/API/Element/getElementsByTagName

Answer 2

您当前的代码 document.querySelectorAll("form input") 基本上是您想要的。但是，然后您执行 [0].value=="" ，这基本上是获取第一个输入并检查它的值是否为空。您可以将 class sand 应用于所有输入，执行以下操作：

function check() {
  var listo = document.getElementsByTagName("input");
  for (var i = 0; i < listo.length; i++) {
    listo[i].classList.add("sand");
  }

  for (let input of listo) {
    input.setAttribute("required", "");
    input.required = true;
  }

  console.log(listo[0]);
}

sandify.onclick = check;

input {
  margin: 5px 0;
}

input.sand {
  border: 1px solid sandybrown;
}

<form>
  <input type="text" /><br/>
  <input type="text" /><br/>
  <input type="text" /><br/>
  <input type="text" /><br/>
  <input type="text" /><br/>
</form>
<button id="sandify">sandify</button>

如何 select 相同标记但不同类的多个元素？使用香草 JS

How do I select multiple elements of same tag but different classes? Using vanilla JS

javascript

getelementsbyclassname

queryselector

如何 select 相同标记但不同 类 的多个元素？使用香草 JS

How do I select multiple elements of same tag but different classes? Using vanilla JS

javascript

getelementsbyclassname

queryselector

如何 select 相同标记但不同类的多个元素？使用香草 JS