
Attention game
Presentation
•
Computers
•
1st Grade
•
Practice Problem
•
Hard
Edukoht Edukohter
Used 10+ times
FREE Resource
57 Slides • 9 Questions
1
Attention game
2
Создай новый проект
Зайди на сайт https://repl.it/ и создай новый проект
3
Начинаем с нашего любимого HTML
4
Ты уже это умеешь
Создай тег «h1» в элементе «body». Напиши внутрь этого тега: Timer.
5
6
Multiple Choice
Какой тег мы можем использовать для создания абзаца в HTML?
<br>
<h1>
<ol>
<p>
7
Ты уже это умеешь
Создай после тега «h1» тег «p».
8
9
Multiple Select
При помощи какого тега и атрибута мы можем вставить картинку на наш сайт?
<img>
<ol>
src
for
<div>
10
Ты уже это умеешь
Создай после тега «p» тег «img». Не забудь использовать атрибут src со ссылкой на свою картинку. PS: выбери еще одну картинку, но ссылку на нее никуда не вставляй.
11
12
Ты уже это умеешь
Создай после тега «img» тег «br».
13
14
Ты уже это умеешь
Создаем две кнопки и укажи у них названия, которые описывают твои картинки. Если ты выбрал(а) картинку кота и собаки, то укажи названия кнопкам: кот и собака.
15
16
А как же дизайн?
17
Ты уже это умеешь
Обратись к тегу «img» и укажи ему какие-то размеры.
18
19
Ты уже это умеешь
Обратись к тегу «button» и укажи ему какие-то размеры.
20
21
Ты уже это умеешь
Сделай так, чтобы все элементы твоего приложения были по центру.
22
23
Немножко магии
24
Ты уже это умеешь
Создай переменные: btnAll и img. Присвой этим переменным выбранные элементы: button и img.
25
26
Multiple Choice
Какую конструкцию мы должны использовать для создания списка?
let allImg = []
let allImg = 5
let allImg = ""
let allImg = {}
27
Multiple Choice
Какую конструкцию мы должны использовать, чтобы записать строку в переменную в JS?
let name = Ivan
let link = "https://www.google.com/"
let number = 5
28
Ты уже это умеешь
Создай список «allImg» и заполни его двумя ссылками на твои фотографии.
29
30
Ты уже это умеешь
Создай переменные: score, text, randomNum, timeText, timerTime. Присвой переменным: score и randomNum число «0». Присвой переменным: text и timeText выбранные элементы «p» и «h1». Присвой переменной timerTime число «60».
31
32
Multiple Choice
Какую функцию мы можем использовать для повторения действий через определенный промежуток времени бесконечное количество раз?
setTimeout()
setInterval()
setRepeater()
setDelay()
33
Ты уже это умеешь
Создай переменную «timer» и присвой ей функцию «setInterval» с параметрами: function и 1000.
34
35
Ты уже это умеешь
В функции конструкции «setInterval» создай if-блок. Укажи у него вот такое условие: timerTime == 0.
36
37
Ты уже это умеешь
В if-блоке напиши вот такие две команды:
btnAll[0].removeEventListener("click",envLetter)
btnAll[1].removeEventListener("click",letter)
38
39
Multiple Choice
При помощи какой функции мы можем остановить работу конструкции «setInterval»?
clearInterval()
clear()
delete()
40
Ты уже это умеешь
Вызови функцию «clearInterval» и передай ей параметр «timer».
41
42
Multiple Choice
При помощи какого метода мы можем изменять текст в теге HTML?
style
setAttribute
innerText
width
43
Ты уже это умеешь
Напиши вот такую конструкцию в свой код:
text.innerText = "You final score is " + score
44
45
Ты уже это умеешь
Выйди из if-блока. Напиши в функции конструкции «setInterval» вот такой кодик:
timeText.innerText = timerTime--
46
47
Multiple Choice
При помощи какого метода мы можем задать нашему элементу какое-нибудь событие?
listenerEventAdd
addEvent
eventAdd
addEventListener
48
Ты уже это умеешь
Выйди из конструкции «setInterval». Напиши вот такие команды:
btnAll[0].addEventListener("click",envLetter )
btnAll[1].addEventListener("click", letter)
49
50
Ты уже это умеешь
Создай функцию «envLetter» и укажи в ней if-блок. Укажи у if-блока условие:
randomNum == 0
51
52
Ты уже это умеешь
Укажи в if-блоке команду, которая будет увеличивать переменную «score» на 1. Воспользуйтесь методом «innerText» у переменной «text». Присвойте этой конструкции переменную «score»
53
54
Ты уже это умеешь
Присвой переменной «randomNum» конструкцию: Math.floor(Math.random()*2)
55
56
Multiple Choice
C помощью какого метода мы можем менять атрибуты и добавлять их у нашего элемента?
innerText
setAttribute
innerHtml
style
57
Ты уже это умеешь
У переменной «img» вызови метод «setAttribute» с параметрами: "src" и allImg[randomNum].
58
59
Ты уже это умеешь
Выйди из if-блока и создай else-блок. Укажи в else-блоке конструкцию, которая будет вычитать единицу от переменной «score». Также добавь вот эти конструкции:
text.innerText = score
randomNum = Math.floor(Math.random()*2)
img.setAttribute("src",allImg[randomNum])
60
61
Ты уже это умеешь
Создай функцию «letter» и укажи у нее if-блок. Укажи if-блоку вот такое условие:
randomNum == 1
62
63
Ты уже это умеешь
Укажи в if-блоке вот такие конструкции:
score++
text.innerText = score
randomNum = Math.floor(Math.random()*2)
img.setAttribute("src",allImg[randomNum])
64
65
Ты уже это умеешь
Создай else-блок и укажи у него вот такие конструкции:
score--;
text.innerText = score
randomNum = Math.floor(Math.random()*2)
img.setAttribute("src",allImg[randomNum])
66
Attention game
Show answer
Auto Play
Slide 1 / 66
SLIDE
Similar Resources on Wayground
45 questions
Project
Presentation
•
1st Grade
46 questions
Where from? Откуда ты? (тренажёр)
Presentation
•
1st Grade
47 questions
Present Tenses
Presentation
•
5th Grade
46 questions
Ветер
Presentation
•
5th Grade
69 questions
скачала6 класс, 5 занятие, чередование корней, впр
Presentation
•
6th Grade
59 questions
colorfullCollision
Presentation
•
1st Grade
49 questions
Restaurant Bill Splitter (independent)
Presentation
•
1st Grade
50 questions
ЦГ 1 (летняя школа)
Presentation
•
KG
Popular Resources on Wayground
10 questions
Safety Day 2026 – Student Review
Quiz
•
9th Grade
21 questions
Continents and Oceans
Quiz
•
6th Grade
20 questions
Parts of Speech
Quiz
•
5th Grade
16 questions
Subject & Predicate
Quiz
•
5th Grade
25 questions
Multiplication Facts
Quiz
•
5th Grade
12 questions
Map Skills
Quiz
•
3rd Grade
22 questions
Continents and Oceans
Quiz
•
5th Grade
15 questions
Rounding Decimals
Quiz
•
5th Grade
Discover more resources for Computers
15 questions
Addition and Subtraction
Quiz
•
1st Grade
26 questions
SLIME!!!!!
Quiz
•
KG - 12th Grade
20 questions
Addition and Subtraction facts
Quiz
•
1st - 3rd Grade
20 questions
Place Value
Quiz
•
KG - 3rd Grade
4 questions
K-2 Force and Motion Lesson
Presentation
•
KG - 2nd Grade
10 questions
Fact Families
Quiz
•
1st Grade
10 questions
Identifying Physical and Chemical Changes
Interactive video
•
1st - 5th Grade
15 questions
Place Value tens and ones
Quiz
•
1st Grade