Mail.ruПочтаМой МирОдноклассникиВКонтактеИгрыЗнакомстваНовостиКалендарьОблакоЗаметкиВсе проекты

Почему console.log вместо нужного элемента html в console браузера (любого), выводит буквенное значение??

LastFaysti [Анархия] Чижиков Ученик (140), на голосовании 10 месяцев назад
скрипт подключен через <link src="site/main.js"> , открывая панель разработчика (f12), в console

должен выводиться " <button class="btn">click</button> " , но вместо этого оно выводит значение " btn " , просто буквенное значение, как это можно исправить?

HTML:

<body>
<button class="btn">click</button>
</body>


JS:

const btn = document.querySelector('.btn')
console.log('btn')
Голосование за лучший ответ
_ Искусственный Интеллект (817288) 11 месяцев назад
Так у тебя и написано в коде console.log('btn')
Саня Семенов Оракул (60499) 11 месяцев назад
 console.log(btn)// если логировать константу а не строчку то в консоле будет элемент вместо строки 
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
в консоле разработчика должен был выводиться элемент button, а не просто тест cube
Саня Семенов Оракул (60499) LastFaysti [Анархия] Чижиков, ты строку передал в console.log вот оно строку и вывело передавал бы элемент вывело бы элемент.
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
вот в этом и вопрос, как вывести именно элемент?
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
При вводе через селектор, оно какого то х... выводит значение null, хотя элемент есть
Саня СеменовОракул (60499) 11 месяцев назад
  1. компилятор всегда прав если говорит нету элемента значит его действительно нету
  2. на странице тоже визуально кнопке не наблюдается на приведенном скрине
  3. еще может быть криво написан селектор
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
можно тогда написать или найти код, где console log будет выводить элемент в консоль корректно? я уже совсем не понимаю в чем ошибка
Саня Семенов Оракул (60499) LastFaysti [Анархия] Чижиков, чтобы вывести корректно надо вызывать так
 console.log(элемент) 
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
через класс тоже не работает
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
я тестировал и (div), и (span) ни то ни то не работает
Саня Семенов Оракул (60499) LastFaysti [Анархия] Чижиков,
  1. во первых у тебя ошибка в коде которая выводится красным . не факт что код после ошибки будет работать вообще
  2. во вторых элементы сами не выбираются их надо выбирать отдельно
  3. кинь код текстом - скажу в чем ошибка, тут не видно
  4. https://codepen.io/norbert123/pen/YzBGbXO так должно быть примерно
  5. если не обладаешь спокойствием и упорством то программить это не твое и учи лучше что нибудь другое
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
Вот ваш код, почему то значение выводит опять null , сейчас кину ввиде текста
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" type="img/x-icon" href="icon/tosha.png">

<script src="js_test.js"></script>
<title>JavaScript</title>
</head>

<body>
<button class="btn">кнопка</button>
</body>

</html>





JS:

btn = document.querySelector('.btn')

//alert(btn) ;
console.log(btn);
Саня Семенов Оракул (60499) LastFaysti [Анархия] Чижиков, попробовал - все выводится (по тому же адресу сохранил). в чем вопрос то ?
LastFaysti [Анархия] ЧижиковУченик (140) 11 месяцев назад
у меня почему то выводиться null, я уже не знаю что думать, уже такие глупые мысли что проблема в visual studia, браузере или самое тупое в моем пк, я только начал изучать js, и у меня сразу же такая ошибка а которой нигде в интернете нету информации
Саня Семенов Оракул (60499) что делает Visual Studio я не знаю. Там же браузерный JS? или nodeJS? вобще код должен работать в браузере а не в IDE а код в примере правильный
Semen Kapacuk Гуру (3597) 11 месяцев назад
Скрипт подключай перед тем как закрывается тег body
 
Павел Просветленный (25483) 11 месяцев назад
 // HTML:

// Скрипт подключаешь с атрибутом defer или в конце body









// JS:

const btn = document.querySelector('.btn');
console.log(btn); // без всяких "btn"....
Dlazder Мудрец (14623) 11 месяцев назад
Это база, товарищ! Нужно знать базовые типы данных. А уже потом у тебя возникнет проблема с null, опять же, это база, все элементы подгружаются по порядку, и скрипт погрузившийся раньше html разметки отработает на пустом документе. В твоем случае querySelector вернет null.
Похожие вопросы