Обычные примеры JavaScript

Эта страница содержит примеры того, что может делать JavaScript.

Внимание:Если эти примеры используют методы, которые вы еще не изучили:ПожалуйстаНе волнуйтесь. Вы узнаете о них в следующей главе.

JavaScript может изменять содержимое HTML

Метод getElementById() возвращает элемент, ID которого совпадает с указанным значением.

Этот пример использует этот метод для поиска элемента HTML (id="para") и изменения его содержимого (innerHTML) на "Hello world":

document.getElementById("para").innerHTML = "Hello world";

JavaScript может изменять значения атрибутов HTML

В этом примере JavaScript изменил<img>тегаsrcЗначение атрибута:

JavaScript может изменять стили HTML (CSS)

JavaScript styleАтрибуты можно использовать для установки инлайн-стиля элементов.

document.getElementById("demo").style.color = "blue";

JavaScript может скрывать элементы HTML

Скрытие элементов HTML можно выполнить, изменив стиль отображения.

document.getElementById("demo").style.display = "none";

JavaScript может отображать элементы HTML

Отображение скрытых элементов HTML можно выполнить, изменив стиль отображения.

document.getElementById("demo").style.display = "block";

JavaScript может создавать всплывающие окна с警报ами

В этом примере JavaScript создает диалоговое окно警报а.

alert("Hello world!");

JavaScript может добавлять обработчики событий к документу

В этом примере JavaScript отслеживает события клика мыши и реагирует на них.

document.addEventListener("click", myFunc);
function myFunc() {
　　　document.body.style.backgroundColor = "coral";
}

JavaScript может показывать время

В этом примере JavaScript показывает текущее время.

var intervalID = setInterval(startTimer, 1000);
function startTimer() {
　　　　var date = new Date();
　　　　var x = document.getElementById("result");
　　　　x.innerHTML = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
}