Javascript практикум для начинающих

Содержание
Читайте также:  Элементы form формы html документа

Saved searches

Use saved searches to filter your results more quickly

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.

Репозиторий для практических заданий по курсу «JavaScript, базовый уровень»

plizkinzmey/javaScriptLevel1

This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Sign In Required

Please sign in to use Codespaces.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching Xcode

If nothing happens, download Xcode and try again.

Launching Visual Studio Code

Your codespace will open once ready.

There was a problem preparing your codespace, please try again.

Latest commit

Git stats

Files

Failed to load latest commit information.

README.md

JavaScript, базовый уровень. Практикум

Репозиторий для практических заданий по курсу «JavaScript, базовый уровень»

Проект использует правила форматирования eslint (https://eslint.org) Некоторые плагины для форматирования установлены через менеджер пакетов npm, который входит в дистрибутив NodeJS

  • Step 1. Склонируйте репозиторий себе на компьютер
  • Step 2. Установите npm (NodeJS) (https://nodejs.org/en/download/)
  • Step 3. Для установки зависимостей из корня проекта выполните npm install
  • Step 4. Для подсказок по форматированию кода скачайте и установите плагин Eslint для вашей среды разработки

About

Репозиторий для практических заданий по курсу «JavaScript, базовый уровень»

Источник

JavaScript Упражнения

Вы можете проверить свои навыки JavaScript с помощью упражнений Schoolsw3.

Упражнения

Мы собрали множество упражнений на JavaScript (с ответами) для каждой главы JavaScript.

Попробуйте решить упражнение, отредактировав код, или поcмотреть ответ, чтобы увидеть, что вы сделали не так.

Читайте также:  Telegram api python polling

Посмотрите свой счет

Вы получите 1 балл за каждый правильный ответ. Ваш счет и общий счет всегда будут отображаться.

Начать упражнения JavaScript

Если вы не знаете JavaScript, предлагаем вам прочитать Учебник JavaScript с нуля.

Онлайн сертификация Schoolsw3

Идеальное решение для профессионалов, которым необходимо совмещать работу, семью и карьеру.

Уже выдано более 25 000 сертификатов!

HTML Сертификат документирует ваши знания HTML.

CSS Сертификат документирует ваши знания современного CSS.

JavaScript Сертификат документирует ваши знания JavaScript и HTML DOM.

Python Сертификат документирует ваши знания Python.

jQuery Сертификат документирует ваши знания jQuery.

SQL Сертификат документирует ваши знания SQL.

PHP Сертификат документирует ваши знания PHP и MySQL.

XML Сертификат документирует ваши знания XML, XML DOM и XSLT.

Bootstrap Сертификат документирует ваши знания the Bootstrap framework.

Мы только что запустили
SchoolsW3 видео

ВЫБОР ЦВЕТА

colorpicker

Сообщить об ошибке

Если вы хотите сообщить об ошибке или внести предложение, не стесняйтесь отправлять на электронное письмо:

Ваше предложение:

Спасибо Вам за то, что помогаете!

Ваше сообщение было отправлено в SchoolsW3.

ТОП Учебники
ТОП Справочники
ТОП Примеры
Получить сертификат

SchoolsW3 оптимизирован для бесплатного обучения, проверки и подготовки знаний. Примеры в редакторе упрощают и улучшают чтение и базовое понимание. Учебники, ссылки, примеры постоянно пересматриваются, чтобы избежать ошибок, но не возможно гарантировать полную правильность всего содержания. Некоторые страницы сайта могут быть не переведены на РУССКИЙ язык, можно отправить страницу как ошибку, так же можете самостоятельно заняться переводом. Используя данный сайт, вы соглашаетесь прочитать и принять Условия к использованию, Cookies и политика конфиденциальности.

Источник

Практика JavaScript для новичков

1. Даны 3 инпута и кнопка. По нажатию на кнопку получите числа, стоящие в этих инпутах и запишите их сумму в четвертый инпут.

2. Даны N инпутов с классом .num и кнопка. По нажатию на кнопку получите числа, стоящие в этих инпутах и запишите их сумму в абзац с .

3. Дан инпут. В него вводится число. По потери фокуса найдите сумму цифр этого числа.

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

Среднее арефметическое цифр =

5. Дан инпут. В него вводится ФИО через пробел. По потери фокуса запишите фамилию, имя и отчество в отдельные инпуты.

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

7. Дан инпут. В него вводится текст. По потери фокуса узнайте количество слов в этом тексте.

8. Дан инпут. В него вводится текст. По потери фокуса узнайте количество символов в самом длинном слове в этом тексте.

В самом длинном слове символов =

9. Дан инпут. В него вводится дата в формате 31.12.2016. По потери фокуса в этом же инпуте поставьте эту дату в формате 2016-12-31.

10. Дан инпут. В него вводится год рождения пользователя. По нажатию на кнопку выведите в абзац ниже сколько пользователю лет.

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

12. Дан инпут. В него вводится слово. По нажатию на кнопку проверьте то, что это слово читается с начала и с конца одинаково (например, мадам).

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

14. Даны N абзацев и кнопка. По нажатию на кнопку запишите в конец каждого абзаца его порядковый номер.

Добавить порядковый номер

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

16. Даны ссылки. По загрузке страницы добавьте в конец каждой ссылки ее href в круглых скобках.

17. Даны ссылки. По загрузке страницы, если ссылка начинается с http://, то добавьте ей в конец стрелку →

18. Даны N абзацев с числами. По нажатию на любой абзац запишите в него квадрат числа, которое в нем находится.

19. Даны N абзацев с числами. По нажатию на любой абзац запишите в него квадрат числа, которое в нем находится.

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

21. Даны N картинок размера 30px. По нажатию на картинку под ними эта картинка появляется размером в 50px.

img img img

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

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

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

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

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

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

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

29. Модифицируйте предыдущую задачу так, чтобы был еще один инпут, в котором задается длина случайной строки.

30. Модифицируйте предыдущую задачу так, чтобы был еще один инпут, в котором задаются символы, из которых формируется эта случайна строка. Символы задаются без всяких разделитетей, в одну строку.

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

Абзац изменяющий цвет каждую секунду

Читайте также:  A href javascript return url

32. Дан инпут. В него вводится число. По потери фокуса сделайте так, чтобы в абзаце ниже начал тикать обратный отсчет, начиная с введенного числа. Когда отсчет дойдет до нуля — он должен закончится.

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

Абзац меняющий цвет, цвета берет из массива

34. Дан абзац. Дан массив строк [‘один’, ‘два’, ‘три’]. Под абзацем ссылка ‘следующая строка’. По заходу на страницу в абзаце должен стоять нулевой элемент этого массива, а по нажатию на ссылку — вставлятся следующий элемент.

35. Даны инпуты с числами. Произвольное количетсво, пусть три. В первый инпут запишите 1, через секунду во второй инпут запишите 2, еще через секунду в третий инпут 3, потом через секунду в первый инпут запишите 4, во второй 5 и так далее до бесконечности.

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

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

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

Какой язык программирования вы знаете?

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

Какой язык программирования вы знаете?

40. Дан чекбокс. Дан инпут. Сделайте так, что если чекбокс отмечен — инпут видимый, если не отмечен — не видимый.

Какой язык программирования вы знаете?

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

Абзац видимый или невидимый

Абзац видимый или невидимый

Абзац видимый или невидимый

Абзац видимый или невидимый

42. Дан инпут. Даны li. В инпут пишется номер. Сделайте так, чтобы по вводу числа, li с заданным номером покрасился в красный цвет.

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

Перечеркнуть Сделать жирным Сделать красным

44. Дан блок с кнопкой ‘закрыть блок’. По нажатию на эту кнопку блок должен исчезнуть. Кнопка размещается внутри блока и должна исчезнуть вместе с ним. Блоков может быть любое количество, каждый из них закрывает своя кнопка.

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

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

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

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis numquam sequi sunt. Aspernatur officiis pariatur repellat.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis numquam sequi sunt. Aspernatur officiis pariatur repellat.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis numquam sequi sunt. Aspernatur officiis pariatur repellat.

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

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

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

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

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

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

  • Россия
    • Город 1
    • Город 2
    • Город 3
    • Город 4
    • Город 1
    • Город 2
    • Город 3
    • Город 4

    Источник

Оцените статью