Игра «камень-ножницы-бумага-ящерица-спок» — более сложная игра. Правило ниже:

КОД Гитхаб

ДЕМО

HTML

Игра находится в игровом контейнере.

Player-container включает в себя счет, текст выбора и пять выбираемых значков с событием onclick.

компьютерный контейнер по той же схеме. но нет события.

Всякий раз, когда происходит сброс, нужно запускать функцию resetAll().

И текст результата показывает каждое событие запуска.

CSS

игровой контейнер: ширина и высота.

установите радиус границы заголовка отдельно.

удалите последнюю иконку margin-right, чтобы сделать все иконки в одну строку.

выбранный стиль добавлен, потому что это имя класса, он не будет работать, если добавить имя идентификатора.

Для адаптивного экрана (большой экран и маленький экран) укажите стили.

ЯВАСКРИПТ

импортируйте модуль, если хотите использовать. прокомментируйте здесь.

выбрать все DOM

все варианты являются объектом правил.

при нажатии на значок запускается функция select().

С помощью Switch, чтобы узнать, что было выбрано, затем измените стиль и текст.

С помощью random(), который может генерировать число 0–1. разделить на 5 вариантов, каждый раздел означает один вариант.

Затем отобразите выбор компьютера, а также изменение стиля.

Когда игрок и компьютер сравниваются, счет и текст сообщения меняются.

Падающая анимация Confetti.js

Когда выиграл, startConfetti()

При проигрыше или ничьей StopConfetti(), removeConfetti()

Сбросьте оценку, выбор и текст при нажатии кнопки сброса, а также инициализируйте при обновлении страницы.

объедините все функции в checkResult() и сначала вызовите их в функции select().

сбросить инициализацию при загрузке.