Как создать функцую в JavaScript. Like Button.

Question

Как создать функцую в JavaScript. Like Button.

Галина Мурзабаева Ученик (132), на голосовании 3 месяца назад

Здравствуйте. Помогите пожалуйста создать функцию JavaScript . кнопку при нажатие которой в отдельном <div> появяется единица, при нажатие во второй раз число опять встаёт на один. спасибо заранее.

Answer 1

Создание функции JavaScript для кнопки "лайк"
HTML:
HTML
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Кнопка лайк</title>
</head>
<body>
<button id="likeButton">Нравится</button>
<div id="likeCount">0</div>

<script src="script.js"></script>
</body>
</html>
JavaScript:
JavaScript
const likeButton = document.getElementById('likeButton');
const likeCount = document.getElementById('likeCount');
let count = 0;

likeButton.addEventListener('click', () => {
count++;
likeCount.textContent = count;
});
Объяснение:
1. HTML:
o Создаем кнопку "Нравится" с id="likeButton".
o Создаем div с id="likeCount" для отображения количества лайков.
o Подключаем script.js.
2. JavaScript:
o Получаем ссылки на элементы кнопки и счетчика лайков.
o Инициализируем переменную count для хранения количества лайков.
o Добавляем обработчик события click к кнопке.
o Внутри обработчика:
 Увеличиваем count на 1.
 Обновляем текст likeCount, отображая новое значение count.
Дополнительно:
• Стиль: Добавьте CSS, чтобы сделать кнопку и счетчик лайков visually appealing.
• Хранение данных: Для постоянного хранения количества лайков можно использовать Local Storage или серверное хранилище.
• Визуальные эффекты: Добавьте анимацию или другие визуальные эффекты при нажатии кнопки.
Пример с использованием Local Storage:
JavaScript
const likeButton = document.getElementById('likeButton');
const likeCount = document.getElementById('likeCount');
let count = 0;

loadLikeCount();

likeButton.addEventListener('click', () => {
count++;
likeCount.textContent = count;
saveLikeCount();
});

function loadLikeCount() {
const storedCount = localStorage.getItem('likeCount');
if (storedCount) {
count = parseInt(storedCount);
likeCount.textContent = count;
}
}

function saveLikeCount() {
localStorage.setItem('likeCount', count);
}
В этом примере:
• loadLikeCount() загружает количество лайков из Local Storage при загрузке страницы.
• saveLikeCount() сохраняет количество лайков в Local Storage после каждого нажатия кнопки.

Answer 2

Daniel Yurgin Знаток (253) 4 месяца назад

А нейросети для кого придумали?

AaacoB AaacМудрец (14157) 4 месяца назад

а ты отдупляешь, что вопрос от бабенки, да еще и чюрки...?

Answer 3

"при нажатие которой в отдельном <div> появляется ЕДИНИЦА"
"при нажатие во второй раз число опять встаёт на ОДИН"

То есть, кнопка не делает ничего?