Element.className возвращает только «неопределенное»
Я пытаюсь сделать небольшую интерактивную галерею, в которой люди могли бы проверять/выбирать некоторые изображения. Некоторые из них я использовал для хранения изображений, а некоторые добавил для обозначения выбранных фотографий. Затем я набрал небольшой код JS, чтобы проверять или снимать отметки с фотографий, используя className файла .
Итак, две мои проблемы:
Код работает не так, как ожидалось. Не могу выбрать ни одно изображение, когда я запускаю свой навигатор.
Консоль возвращает только «неопределенный», как поясняется в приведенном ниже коде.
Это своего рода моя первая попытка в JS, и я действительно не понимаю, что не работает, поэтому я надеюсь, что вы получите ответ или, по крайней мере, некоторые небольшие указания для меня. :)
Спасибо, Томас
попробуй document.getElementByClassName('the-class')[0]
Да, извини. Я понял, что это был не лучший способ поделиться своим вопросом :) Я буду иметь это в виду, когда у меня будет еще один вопрос. :)
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
getElementsByClassName дает набор элементов. Свойство className доступно для определенного элемента в этом списке. Нет в самом списке.
... так что решение есть?
@Jeremy: ... для доступа к свойству определенного элемента. Нет в самом списке.
@ Джереми: я не согласен. Указание источника ошибки является, отвечая на вопрос. Я оставлю ОП решать, как справиться с тем фактом, что он обращается с коллекцией так, как если бы это был один элемент. Кто-то в комментариях упоминает доступ к [0], один ответ предлагает повторить сбор. У меня недостаточно знаний о предполагаемом программном обеспечении, чтобы рекомендовать его в любом случае. Человек, пишущий код, должен понимать, что имеет дело с коллекцией, а не с отдельным узлом, и принимать взвешенное решение на основе этого. Не просто копируйте любой код, чтобы решить проблему.
Я бы предпочел согласиться с Дэвидом, потому что для новичка мне кажется более полезным получить несколько советов, не получая полного решения. Это «заставляет» меня проводить некоторые исследования, и это тоже круто. Но спасибо вам обоим, ребята!
Как ты хочешь. В общем, на Stackoverflow подсказка должна быть размещена в виде комментария. Ответы должны быть реальными ответами, полными решениями. Но не бери в голову.
Проблема в том, что document.getElementsByClassName возвращает HTMLCollection и HTMLCollection. Вы должны проверить className его элементов.
Вы можете просмотреть его, а затем получить className каждого элемента
for(let i = 0;i<unslectedClass.length;i++){
console.info(unselectedClass[i].className);
}
Или преобразуйте HTMLCollection в реальный массив с помощью Spread Operator и используйте forEach()
[...unselectedClass].forEach(x => console.info(x.className))
Как упоминалось в предыдущих ответах, метод getElementsByClassName возвращает HTMLCollection элементов с именем класса, которое вы передаете методу. Если вам нужно получить доступ к любому из элементов, вам нужно будет сделать это как массив.
Например, получение первого элемента коллекции.
unselectedClass[0].className;
В противном случае вы можете использовать цикл for для доступа к каждому элементу в коллекции.
for (var i = 0; i < unselectedClass.length; i++) {
var class = unselectedClass[i].className;
}
Просто идеальный ответ! Я не нашел его, когда проводил исследование, но спасибо за терпение, чтобы ответить мне :)
Пожалуйста, не размещайте изображения кода. Вы должны вставить реальный рабочий фрагмент или хотя бы текст кода