практика js

Содержание

Слайд 4

2) Дан input. В него вводится число. По потери фокуса вводиться цифра

2) Дан input. В него вводится число. По потери фокуса вводиться цифра на экран.
на экран.

Слайд 6

3) Дан input. В него вводятся числа через запятую. По потери фокуса

3) Дан input. В него вводятся числа через запятую. По потери фокуса
найдите среднее арифметическое этих чисел (сумма делить на количество). 

Слайд 8

4) Дан input. В него вводится ФИО через пробел. ФИО вводится с

4) Дан input. В него вводится ФИО через пробел. ФИО вводится с
маленькой буквы. Сделайте так, чтобы по потери фокуса input, введенные фамилия, имя и отчество автоматически стали записанными с большой буквы (в том же input). 

Слайд 10

5) Дан input. В него вводится дата в формате 04.07.2022. По потери

5) Дан input. В него вводится дата в формате 04.07.2022. По потери
фокуса в этом же инпуте поставьте эту дату в формате 2022-07-04.

Слайд 12

 6) Дан input. В него вводится год рождения пользователя. По нажатию на

6) Дан input. В него вводится год рождения пользователя. По нажатию на
кнопку считает сколько вам лет.

Слайд 14

7) Дан input. В него вводится дата в формате 04.07.2022. По потери

7) Дан input. В него вводится дата в формате 04.07.2022. По потери
фокуса узнайте день недели (словом), который приходится на эту дату.

Слайд 16

8) Дан input. В него вводится число. Проверьте по вводу, что это

8) Дан input. В него вводится число. Проверьте по вводу, что это
число содержит внутри себя цифру 3

Слайд 18

9) Даны картинки. По нажатию на любую картинку увеличьте ее в 2

9) Даны картинки. По нажатию на любую картинку увеличьте ее в 2 раза.
раза.

Слайд 20

10) Даны картинки. По первому нажатию на любую картинку увеличьте ее в

10) Даны картинки. По первому нажатию на любую картинку увеличьте ее в
2 раза. По второму нажатию - уменьшите обратно

Слайд 22

11) Дан input. Реализуйте кнопочки +, -, которые будут увеличивать или уменьшать на

11) Дан input. Реализуйте кнопочки +, -, которые будут увеличивать или уменьшать
1 значение input. Сделайте так, чтобы это значение не могло стать меньше нуля.

Слайд 24

12) Дан input. В него вводится число. По потери фокуса проверьте, что

12) Дан input. В него вводится число. По потери фокуса проверьте, что
в нем лежит число от 1 до 100. Если это так - покрасьте input в зеленый цвет, а если не так - в красный. 

Слайд 26

13) Дан input. Выделите любой текст на странице. По окончанию выделения этот

13) Дан input. Выделите любой текст на странице. По окончанию выделения этот
текст должен записаться в этот input.

Слайд 28

Дан input и кнопка. По нажатию на кнопку сгенерируйте случайную строку из

Дан input и кнопка. По нажатию на кнопку сгенерируйте случайную строку из
8-ми символов и запишите в input .

Слайд 29

charAt() возвращает символ по заданному индексу внутри строки. 

charAt() возвращает символ по заданному индексу внутри строки.

Слайд 30

Дан абзац. Сделайте так, чтобы каждую секунду он менял свой цвет с

Дан абзац. Сделайте так, чтобы каждую секунду он менял свой цвет с
красного на зеленый и наоборот

Слайд 32

Дан input абзац. Дан массив цветов ['red', 'green', 'blue']. Сделайте так, чтобы

Дан input абзац. Дан массив цветов ['red', 'green', 'blue']. Сделайте так, чтобы
каждую секунду абзац менял свой цвет на определенное значение их массива: сначала 'red', потом 'green' и так далее.

Слайд 34

Дана ссылка. Дан checkbox. По нажатию на ссылку меняйте состояние checkbox с

Дана ссылка. Дан checkbox. По нажатию на ссылку меняйте состояние checkbox с
отмеченного на неотмеченное и наоборот

Слайд 36

Даны checkbox. Дана кнопка. По нажатию на кнопку сделайте все checkbox отмеченными.

Даны checkbox. Дана кнопка. По нажатию на кнопку сделайте все checkbox отмеченными.

Слайд 38

Спросите у пользователя какой язык (html, css, js, php) он знает с

Спросите у пользователя какой язык (html, css, js, php) он знает с
помощью радио кнопочек. Выведите этот язык в абзац.

Слайд 40

Спросите у пользователя какие языки (html, css, js, php) он знает с

Спросите у пользователя какие языки (html, css, js, php) он знает с
помощью чекбоксов. Выбранные языки должны выводится в абзац ниже через запятую.

Слайд 42

Дан checkbox. Дан input. Сделайте так, что если checkbox отмечен - input

Дан checkbox. Дан input. Сделайте так, что если checkbox отмечен - input
видимый, если не отмечен - не видимый.

Слайд 44

Даны checkbox. Под каждым checkbox размещен абзац. Сделайте так, что если checkbox

Даны checkbox. Под каждым checkbox размещен абзац. Сделайте так, что если checkbox
отмечен - соответствующий абзац видимый, а если не отмечен - не видимый. 

Слайд 46

Дан абзац. Даны чекбоксы 'перечеркнуть', 'сделать жирным', 'сделать красным'. Если соответствующий чекбокс

Дан абзац. Даны чекбоксы 'перечеркнуть', 'сделать жирным', 'сделать красным'. Если соответствующий чекбокс
отмечен - заданное действие происходит с абзацем (становится красным, например). Если чекбоксу снять отметку - действие отменяется

Слайд 48

В инпут через запятую вводятся страны. По нажатию на кнопку сделайте так,

В инпут через запятую вводятся страны. По нажатию на кнопку сделайте так,
чтобы эти страны записались в ul под инпутом (каждая страна отдельный li).

Слайд 50

В инпут вводится страна и нажимается Enter. По нажатию на Enter сделайте

В инпут вводится страна и нажимается Enter. По нажатию на Enter сделайте
так, чтобы введенные страны записывались в абзац под инпутом через запятую. То есть по каждому нажатию Enter в абзац будут добавляться все новые и новые страны

Слайд 52

На странице есть дивы. В них есть текст. Обойдите все дивы и

На странице есть дивы. В них есть текст. Обойдите все дивы и
обрежьте тот текст, который в них стоит так, чтобы он стал длиной 10 символов. И добавьте троеточие в конец обрезанного текста

Слайд 54

Дана таблица с числами. По нажатию на ячейку она активируется и становится

Дана таблица с числами. По нажатию на ячейку она активируется и становится
красного цвета. Активировать можно много ячеек. Под таблицей кнопка. По нажатию по этой кнопке в абзац ниже выведите сумма активированных ячеек. Реализуйте кнопку 'сбросить активированные ячейки'.

Слайд 56

Дана таблица. По нажатию на ячейку в ней появляется инпут с содержимым

Дана таблица. По нажатию на ячейку в ней появляется инпут с содержимым
этой ячейки и кнопка сохранить. Можно поредактировать текст в инпуте, сохранить - и текст ячейки поменяется. 

Слайд 58

Реализуйте раскрывающийся список. По умолчанию есть список стран (ul), по нажатию на

Реализуйте раскрывающийся список. По умолчанию есть список стран (ul), по нажатию на
страну внутри li со страной появляется список городов.

Слайд 60

Даны два селекта. В первом находятся страны, во втором - города. Сделайте

Даны два селекта. В первом находятся страны, во втором - города. Сделайте
так, чтобы когда выбирается определенная страна - в другом селекте появлялись города этой страны. В абзац ниже пишите выбранную страну и город через запятую.

Слайд 62

 Дан список и кнопка. По нажатию на кнопку посортируйте пункты списка по

Дан список и кнопка. По нажатию на кнопку посортируйте пункты списка по возрастанию.
возрастанию. 

Слайд 64

 Дан ряд ссылок. Сделайте так, чтобы по нажатию на ссылку она становилась

Дан ряд ссылок. Сделайте так, чтобы по нажатию на ссылку она становилась
с красным фоном. По нажатию на другую ссылку выделение первой ссылки снимается и выделяется та, на которую мы нажали. В абзац ниже пишите текст активной ссылки.
Имя файла: практика-js.pptx
Количество просмотров: 43
Количество скачиваний: 0