Как выбрать несколько элементов одного тега, но разных классов? Используя ваниль JS - PullRequest
Новая
       83

Как выбрать несколько элементов одного тега, но разных классов? Используя ваниль JS

0 голосов
/ 12 апреля 2020

У меня есть 6 входов в форме, каждый с классом .first .second .third .fourth .fifth .sixth соответственно, и я хотел бы выбрать их с помощью vanilla JS, но после попытки с getElementsByClassName и querySelectorAll, это все еще не сработало.

вот моя строка кода: 

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

Как мне выбрать все элементы с этими классами?

Заранее спасибо за любую оказанную помощь!

Ответы [ 2 ]

1 голос
/ 12 апреля 2020

Вы просто выбираете по имени тега: 

const elements = document.getElementsByTagName("input")

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

0 голосов
/ 12 апреля 2020

Ваш текущий код document.querySelectorAll("form input") в основном получает то, что вы хотите. Однако затем вы делаете [0].value=="", который в основном получает первый ввод и проверяет, является ли его значение пустым. Вы можете применить класс 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>
...