Не работают классы в поиске(

Question

Мне тут люди на форуме сказали, что использовать getElementsByClassName не стоит, так как это устаревший метод. Вместо него порекомендовали querySelector и querySelectorAll.

Но как найти классы css при помощи эту двух методов?

alert find = main.querySelector('second')
alert(find);

.main{
background: orange; elem.querySelector(css)
}

.second {
font-size: 2vmax;   
margin-left: 50%;
}

<div class="main">
<div class="second">
Text
</div>
</div>

Answer 1

У вас небольшая путаница в коде. Попробуйте так (.querySelector() можно использовать и с документом, и с элементами, и не забывайте добавлять точку перед селектором класса):

const main = document.querySelector('.main');
const second = main.querySelector('.second');
alert(second);

.main{
  background: orange;
}

.second {
  font-size: 2vmax;   
  margin-left: 50%;
}

<div class="main">
  <div class="second">
    Text
  </div>
</div>

Answer 2

Научиться писать селекторы: надо .second.
Не писать мусор в скрипте: что за alert find =?
Не использовать несуществующие переменные: main.
Не писать мусор в стилях: elem.querySelector(css).
Объявлять переменные явно.
Метод getElementsByClassName не устаревший, они просто для разных целей нужны.

var main = document.querySelector('.main')
var elem = main.querySelector('.second')
console.log(elem);

var el = document.querySelector('.second')
console.log(el);

.main{
  background: orange;
}

.second {
  font-size: 2vmax;   
  margin-left: 50%;
}

<div class="main">
  <div class="second">
    Text
  </div>
</div>

БЛОГ НА HUSL

Не работают классы в поиске(

Ответы (2 шт):