Nikstorma
@Nikstorma
Ищу компаньона - веб-разработчика

Как исправить ошибку JS Cannot read property 'width' of undefined?

Есть простой код на JS, но он выдает ошибку, как в скабже:
<!DOCTYPE html>
<body>
 <br><p class="www">sdsdd</p>
<br><a href="#" onmouseover="over();">qwerty</a>
<script type="application/javascript">
	function over(){
		alert(document.getElementsByClassName("www").style.width);
	}
</script>
 </body>

</html>
То же самое происходит, если попытаться задать цвет тексту.
В чем ошибка?
  • Вопрос задан
  • 2151 просмотр
Решения вопроса 1
Во-первых, document.getElementsByClassName() возвращает HTMLCollection (похоже на массив). Поэтому, чтобы получить конкретный элемент нужно указать индекс. document.getElementsByClassName("www")[0].
Во-вторых, ширину вы так не получите. Нужно использовать offsetWidth.
В-третьих, забыли указать после <!DOCTYPE html><html> (в конце же его закрыли).
В итоге получим:

<!DOCTYPE html>
<html>
<body>
 <br><p class="www">sdsdd</p>
<br><a href="#" onmouseover="over();">qwerty</a>
<script type="application/javascript">
  function over(){
    alert(document.getElementsByClassName("www")[0].offsetWidth);
  }
</script>
 </body>

</html>
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
@Rabinzon
getElementsByClassName возвращает массив нод.
Вот так должно работать.
document.getElementsByClassName("www")[0]
Пример
Ответ написан
Комментировать
aliencash
@aliencash
Партизан
Таким образом на js можно получить стили только если они были заданы ранее в js-скрипте или inline в html.
<br><p class="www" style="width: 100px">sdsdd</p>
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
26 нояб. 2024, в 13:05
450 руб./в час
26 нояб. 2024, в 12:58
30000 руб./за проект
26 нояб. 2024, в 12:56
1500 руб./в час