Перейти к содержанию

Практические задания по JavaScript

Материал из Викиучебника — открытых книг для открытого мира

Сборник практических заданий по JavaScript:

  1. Вывести таблицу 10×10, заполненную числами от 1 до 100.
  2. Сделать, чтобы при наведении указателя мыши на изображение это изображение переворачивалось вверх ногами.
  3. В папке images есть изображения 1.jpg, 2.jpg, 3.jpg, 4.jpg, 5.jpg, 6.jpg, 7.jpg, 8.jpg, 9.jpg. Вывести случайное изображение из этой папки.
  4. Создать форму, в которую можно ввести два числа и получить сумму этих чисел.
  5. Вывести текст красным цветом, если используется браузер Internet Explorer, синим — если используется браузер Firefox и зелёным — если Google Chrome.
  6. Создать калькулятор с вводом в форму чисел. При нажатии на кнопку должен выводиться результат.
  7. Создать кнопку, добавляющую параграф.
  8. Создать рисунок на Canvas.
  9. В HTML-коде есть <input type="text" id="myInput"> и <label for="myInput" id="myLabel"><button onclick="myFunction()" id="myButton">Мой кот:</label>. Необходимо написать JavaScript-функцию myFunction() так, чтобы, при нажатии на кнопку, в ней сменялся текст с «Мой кот:» на «Моя кошка:» и наоборот.[1]

Автор задач — Участник:Butko.

Примечания

[править]
  1. Если Вы — новичок в JavaScript, то попробуйте этот вариант решения:
    function myFunction() {
    let button = document.getElementById('myButton');
    button.innerHTML = 'Моя кошка:';
    button.setAttribute('onclick', 'myFunction1()';
    }
    
    function myFunction1() {
    let button = document.getElementById('myButton');
    button.innerHTML = 'Мой кот:';
    button.setAttribute('onclick', 'myFunction()';
    }
    

    Если Вы уже довольно хорошо знаете JavaScript, сделайте другой код — более сложный, с использованием конструкции if..else.