Главная страница>Учебник по веб-дизайну>Учебник по Javascript

Используйте JavaScript для имитации игр с набором текста!

Автор：Eve Cole Время обновления：2022-08-10 11:30:26
Мне сегодня нечего делать, и я хочу попробовать симулированную игру набора текста. Ниже приведен рендеринг. Он будет записывать и оценивать набор текста. Если вы добавите функцию setInterval на периферию, вы сможете проверить скорость набора текста.

html

<div class="wrapper">
  <div id="text">А</div>
  <input type="text" id="ipt">
</div>
тело

CSS

,
html {
  ширина: 100%;
  высота: 100%;
 }

 .wrapper {
  ширина: 400 пикселей;
  поле: 20 пикселей авто;
 }

 дел {
  размер шрифта: 100 пикселей;
  вес шрифта: 900;
  выравнивание текста: по центру;

 }
 вход{
  ширина: 400 пикселей;
  поле: 20 пикселей авто;
 }

js

var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
var text = document.getElementById('текст') 
вар ipt = document.getElementById('ipt')
вар рез;
вар newRes;
вар случайный = Math.round(Math.random() * 25);
количество вар = 0
 window.onkeyup = функция (е) {
  вар случайный = Math.round(Math.random() * 25);
  newRes = ул[случайный]
  рез = текст.innerHTML
  text.innerHTML = newRes
  if(e.keyCode == res.charCodeAt(0)){
   считать++;
   ipt.value = '';
  }еще{
   alert('игра окончена' + ' ' +'Ваш счет'+ ':' + count)
   счет = 0;
   ipt.value = '';
  }

 }

Рекомендации по теме: [Видеоурок по JavaScript]

Выше представлена ​​игра с набором текста, смоделированная с использованием JavaScript! Для получения более подробной информации, пожалуйста, обратите внимание на другие статьи по теме на китайском сайте php!
Связанные статьи