Javascript примеры html: JavaScript Примеры | Schoolsw3.com
JavaScript Основы
Язык JavaScript открывает безграничные возможности по Web-дизайну и по интерактивности Web-страниц, о чём более подробно говорилось в описании разделе по языку JavaScript.
Однако, чтобы научиться его использовать необходимо познакомиться с основами языка JavaScript. И тут приходит на помощь данная категория сайта.
Многие думают, что JavaScript — это сложный язык. На самом деле, это не так, далеко не так, и освоить его в состоянии любой человек, который имеет хоть какое-то мышление. И чтобы направить это мышление в нужную сторону, необходимо ознакомиться с материалами по основам JavaScript, которые представлены в данной категории абсолютно бесплатно!
Прочитав статьи по основам JavaScript, Вы узнаете:
1) Код простейшей программы Hello World на языке JavaScript.
2) Как создавать, инициализировать и использовать переменные в JavaScript.
3) Какие бывают типы переменных в JavaScript.
4) Как создавать и использовать функции в JavaScript.
5) Об условном операторе в JavaScript.
6) Какие бывают операторы цикла в JavaScript.
7) Об операторе switch case в JavaScript.
8) Как создавать массивы в JavaScript.
9) Об ООП в JavaScript.
10) Об объекте Math в JavaScript.
11) Как работать с массивами в JavaScript.
12) Как работать со строками в JavaScript.
13) Как работать с датой и временем в JavaScript.
14) Об объекте Number в JavaScript.
15) Об объекте Window в JavaScript.
16) Об объекте Document в JavaScript.
17) Как реализовать редирект на JavaScript.
18) Об объекте Image в JavaScript.
19) Об объекте Link в JavaScript.
20) Как узнать браузер пользователя в JavaScript.
21) Как сделать проверку формы в JavaScript.
22) Как получить доступ к любому объекту HTML через JavaScript.
23) Об объекте Object в JavaScript.
24) О событиях и их обработчиках в JavaScript.
25) Как реализовать таймер в JavaScript.
26) Как обработать исключения в JavaScript.
27) Как создать собственный объект в JavaScript.
28) Как решить проблему отображения PNG в IE6.
29) Как проверить включён или нет JavaScript у пользователя.
30) Как сделать валидным JavaScript.
31) Что такое JSON.
32) Как зашифровать JavaScript.
33) Как отправить POST-запрос через JavaScript.
34) Как сделать горячие клавиши на сайте.
35) Как сделать визуальный редактор на JavaScript.
36) Как запустить несколько функций в onload.
37) Как сделать перетаскиваемый DIV на JavaScript.
38) Как сделать исчезающий текст в input.
39) Как создать ассоциативный массив в JavaScript.
40) Как найти ошибку в JavaScript.
41) О работе с cookie через JavaScript.
42) Как отправить ajax-запрос на другой домен.
43) Как установить комментарии ВКонтакте на сайт.
44) Как динамически проверить форму.
45) Как обработать колёсико мыши на JavaScript.
46) Как обработать закрытие вкладки на JavaScript.
47) Когда стоит использовать jQuery.
48) Как отслеживать лайки социальных сетей на JavaScript.
49) Как динамически подгружать данные для select.
50) Об аналоге str_replace() в JavaScript.
51) Как изменить стиль у select.
52) Как сделать изменение размеров у div на JavaScript.
53) Как проверить: активен пользователь на странице или нет.
54) Как прокрутить скролл до низа у div.
55) Как сделать слайдер изображений на jQuery без плагинов.
56) Как воспроизвести звук на JavaScript.
57) Как изменять дизайн сайта в зависимости от времени суток.
58) Как подключить Яндекс.Карты к сайту.
59) Как проверить сложность пароля на JavaScript.
60) Как проверить занятость логина на Ajax.
61) Как определить местоположение посетителя.
62) Что такое объекты, конструкторы и прототипы в JavaScript.
63) Какие новые методы для работы с массивами появились в ES5.
64) Что такое стандартная модель событий в JavaScript.
65) Как вешать события для старых Internet Explorer(8-).
66) Загрузка файлов в стиле Drag and Drop.
67) Загрузка файлов в стиле Drag and Drop. Продолжение.
68) Загрузка файлов в стиле Drag and Drop. Заключение.
69) Что такое AngularJS.
70) Что такое AngularJS. Решаем проблему с валидностью.
71) Как изменить стандартный вид select на JavaScript.
72) Что такое Long-Polling, WebSockets, SSE и Comet.
73) Какие различия между объявлениями функций function declaration и function expression в javascript.
74) Какие существуют способы преобразования типов в JavaScript.
75) Как использовать анонимные самовызывающиеся функции и функции обратного вызова в JavaScript.
76) Как сделать динамическое добавление комментариев, используя Ajax.
77) Как сделать динамическое добавление комментариев в базу данных, используя Ajax.
78) Как быстро сделать всплывающие подсказки на JavaScript.
79) Что такое трансформатор иконок — Marka.
80) Как сделать эффект при клике в материальном дизайне на JavaScript.
81) Как сделать динамические тени на JavaScript, используя библиотеку shine.js.
82) Как визуализировать данные на JavaScript.
83) Как сделать онлайн-трансляцию вашей веб-камеры на чистом JavaScript.
84) Как сделать потрясающие анимации на javascript, используя библиотеку Scripty2.
85) Как сделать захват изображения с веб-камеры на JavaScript.
86) Что нового появилось в EcmaScript 6.
87) Как преобразовать код с ES6 в ES5.
88) Что такое замыкание в JavaScript.
89) Как определить, смотрит ли пользователь на страницу на javascript.
90) Библиотека javascript — underscore.js.
91) Изучаем CoffeeScript. Введение.
92) Изучаем CoffeeScript. Типы данных.
93) Изучаем CoffeeScript. Операторы.
94) Изучаем CoffeeScript. Функции.
95) Изучаем CoffeeScript. Условия.
96) Как работать со стилями в JavaScript.
97) Как работать с классами в ES 2015.
98) Изучаем CoffeeScript. Циклы.
99) Как сделать таймер обратного отсчета на javascript в 18 строк кода.
100) Как сгенерировать случайное число в javascript.
101) Изучаем CoffeeScript. Классы.
102) Зачем нужно ключевое слово Let в ES6.
103) Что такое стрелочные функции в ES6.
104) Как сделать 3D модель объекта на JavaScript.
105) Что такое обещания в ES6.
106) Как работать с хранилищами с использованием Basil.js.
107) NodeJS. Введение.
108) NodeJS. Установка платформы.
109) Gulp. Введение.
110) NodeJS. Движок V8.
111) Gulp. Установка и настройка.
112) NodeJS. Глобальный объект.
113) NodeJS. Как работают Function Expression.
114) NodeJS. Модули.
115) NodeJS. Шаблоны модулей.
116) NodeJS. Обработчик событий.
117) NodeJS. Запись и чтение файлов.
118) Gulp. Структура проекта и работа задач.
119) Gulp. Наблюдение за изменениями в файлах.
120) NodeJS. Создание и удаление директорий.
121) NodeJS. Клиенты и серверы.
122) NodeJS. Как создать сервер.
123) Как изучить JavaScript быстрее.
124) Как визуализировать данные и рисовать на JavaScript.
125) NodeJS. Что такое потоки и буферы.
126) NodeJS. Как считывать данные с потока.
127) NodeJS. Как записывать данные в поток.
128) Анимация элементов при прокрутке страницы на чистом JavaScript.
129) NodeJS. Что такое pipe().
130) NodeJS. Потоковый вывод HTML страницы.
131) NodeJS. Как отправить данные в формате JSON.
132) Что такое SPA в веб-разработке.
133) NodeJS. Навигация по страницам.
134) NodeJS. Что такое NPM.
135) NodeJS. Как работать с файлом package.json.
136) NodeJS. Пакет Nodemon.
137) NodeJS. Начинаем работу с Express.
138) NodeJS. Параметры маршрутизации в Express.
139) NodeJS. Template Engine. Часть 1.
140) NodeJS. Template Engine. Часть 2.
141) NodeJS. Как собрать шаблон из нескольких частей.
142) NodeJS. Что такое Middleware и статические файлы.
143) NodeJS. Что такое Query Strings.
144) NodeJS. Как обрабатывать POST запросы.
145) NodeJS. Как создать «список дел«. Часть 1.
146) NodeJS. Как создать «список дел«. Часть 2.
147) NodeJS. Как создать «список дел«. Часть 3.
148) Как правильно обрабатывать ошибки в JavaScript.
149) Как использовать методы объекта JSON.
150) Как использовать циклы: for…in и for…of в JavaScript ES6.
151) Что такое метод querySelector в JavaScript.
152) Как объявлять константы в JavaScript ES6.
153) О JavaScript const и объектах.
154) Об использовании инструкции «use strict» в JavaScript. Часть 1.
155) Об использовании инструкции «use strict» в JavaScript. Часть 2.
156) Что такое деструктурирующее присваивание в JavaScript ES6.
157) Как деструктурировать объекты в ES6.
158) Зачем нужны cтроковые шаблоны в JavaScript ES6.
159) Как сделать меню аккордеон на JS.
160) Как сделать всплывающую форму.
161) Как сделать модальное окно на CSS + JS.
162) Как сделать прогресс бар на CSS + JS.
163) Как сделать вкладки в HTML.
164) Как получить input в JavaScript (1 часть).
165) Как вывести результат в JavaScript (2 часть).
166) Как вывести текст в JavaScript.
167) Какие есть примеры If-Else в JavaScript.
168) О способах объявления переменных (var, let, const) в JS.
169) Какие есть примеры цикла for в JavaScript.
170) Как создать и вывести массив в JS.
171) Какие бывают методы массива в JS.
172) Понятиях функции (return, параметры) в JS.
173) Как получить элемент в JS.
174) Что такое ассоциативный массив в JS.
175) Как добавить класс по клику в JavaScript.
176) Как сделать таймер отсчета на JS.
177) Как сделать валидацию формы на JS.
178) Как показать скрытый текст на JS.
179) Валидация номера телефона на JS.
180) Валидация номера телефона на JS.
181) Отложенная загрузка изображений (Lazyload).
182) Установка базы данных MongoDB.
183) Карусель на чистом JS.
184) Pug – это не мопс, тогда кто
185) Зачем нужен компилятор Babel
186) Gulp файл и сборка CSS
187) Число – тип данных в JS
188) Строки – тип данных в JS
189) Примеры prompt, alert и confirm в JS
190) Задачи с решениями на JS
191) Как получить элементы по селектору в JS
192) Объекты в JS — сложный тип данных
193)Манипуляции с элементами в JS.
194)Обработчик и объект событий в JS.
195)Callback функция в JS.
196)Пример анимации движения в JS.
197)Делегирование событий в JS.
198)Модальное окно на JS.
199)Работа с LocalStorage на примере.
200)Ключевое слово this в JavaScript.
201)Асинхронность в JavaScript.
202)Перебор массива в JS — метод forEach.
203)Прототипы в JS.
204)Эффект печатающегося текста на JS.
205)Показать пароль на JS.
206)Фильтр товаров на JS.
207)Рекурсия в JavaScript.
208)Классы в JavaScript.
209)Программистом может быть каждый.
210)Установка node + gulp для Windows 10.
211)Адаптивное мобильное меню для сайта (часть 1).
212)Адаптивное мобильное меню для сайта (часть 2).
213)Адаптивное мобильное меню для сайта (часть 3).
214)Показать и скрыть элемент на JS.
215)Как сделать спойлер на сайте.
216)Анимированный фон с плагином ParticlesJS.
217)Типы данных в TypeScript.
218)Уменьшение баннера при прокрутке страницы вниз.
219)Получение координат курсора мыши на JS.
220)События Drag-and-Drop в JS.
221)Раскрывающийся список на JavaScript.
222)
220)События Drag-and-Drop в JS.
221)Раскрывающийся список на JavaScript.
222)Шаблоны и флаги в JS (регулярные выражения).
223)Как установить и настроить JSHint.
224)Set в JavaScript.
225)Map в JavaScript.
226)Стрелочные функции в JS.
227)Быстрая сортировка массива в JS.
228)Сортировка массива на JS.
229)Создание теста для сайта на JavaScript.
230)Что такое Promise в JS.
231)Операторы Spread&REST.
232)Основы ООП в JavaScript.
233)Шаблонные строки в JS (интерполяция).
234)Cоздание списка из массива на JS.
235)Атрибуты async, defer в JS.
236)Работа с датами в JS.
237)JSON формат передачи данных.
238)Как установить и настроить ESLint.
239)Функция requestAnimationFrame.
240)Что такое парсинг сайтов?
241)Деструктуризация массивов и объектов в JS.
242)Модули в JavaScript (ES6).
243)Перебор массивов циклом for.. of.
244)Создание приложения на React.
Все материалы по основам JavaScript
Создание сайта с JavaScript
Создать полноценный VEB-сайт полностью на языке JavaScript невозможно,да и ничего хорошего в этом нет.Надо создать HTML страницу а уже потом включать в него коды JavaScript.
Спецификация HTML 4 поддерживает атрибут type:
<script type=»text/javascript»>
В HTML 4 если вы собираетесь использовать в файле только JavaScript можно прописать в мете-тегах указание на его использование:
<meta http-equiv=»Content-Script-Type» content=»text/javascript»>
При этом атрибуты language или type указывать не надо.
Javascript подключается к HTML-странице и работает без компиляции. Чтобы подключить Javascript надо в странице указать:
<script language=»JavaScript»>
Здесь пишется содержимое JS
</script>
Можно подключить и так:
<script language=»JavaScript»>
</script>
Запишем пример включения Javascript в страницу:
<html>
<head>
<title>JavaScript</title>
<script type=»text/javascript» language=»javascript»>
</script>
</head>
<body>
<script type=»text/javascript» language=»javascript»>
Здесь пишется содержимое JS
</script>
</body>
<html>
Размещайте JavaScript в самом конце страницы перед <body>
В качестве примера возьмем создание простейшего сайта на главной странице.
Это код данного сайта.
<html>
<head>
<title>Создание сайта
</title>
<meta http-equiv=»Content-Type» content=»text/html; charset=windows-1251″>
</head>
<body>
Создание собственного сайта.
<img src=»images/com (8).gif» width=213 height=170 border=0>
</body>
</html>
Теперь включим JavaScript в страницу
<html>
<head>
<title>Создание сайта
</title>
<meta http-equiv=»Content-Type» content=»text/html; charset=windows-1251″>
</head>
<body>
Создание собственного сайта.
<img src=»images/com (8).gif» width=213 height=170 border=0>
<script language=»JavaScript»>
document.write(«Это включение JavaScript»)
</script>
</body>
</html>
В малом окне вы можете посмотреть результат включения JavaScript в HTML.
Создание сайта
Создание собственного сайта. |
В JavaScript 1.1 тег <script> поддерживает атрибут src. Если вы разместили скрипт в другом файле то надо указать путь к URL файлу, в котором содержится код:
<script src=»../javascript/name.js»></script>
JavaScript Типы данных | Schoolsw3.com
JavaScript типы данных
JavaScript переменные могут содержать несколько типов данных: числа, строки, объекты и т.д.:
var length = 16; // Числа
var lastName = «Андрей»; // Строки
var
x = {firstName:»Андрей», lastName:»Щипунов»}; // Объекты
Концепция типов данных
При программировании типы данных являются важной концепцией.
Возможность работать с переменными, важно знать кое-что о типах данных.
Без типов данных компьютер не может безопасно решать эту проблему:
var x = 16 + «Вольво»;
Есть ли смысл, добавлять число шестнадцать до "Вольво"
? Будет выдавать ошибку или получит результат?
JavaScript будет рассматривать приведенный пример выше, так же как:
var x = «16» + «Вольво»;
При добавлении в JavaScript числа к строке, число, будет рассматриваться, как строка.
JavaScript вычисляет выражения слева направо. Разные последовательности, могут привести к различным результатам:
В первом примере JavaScript рассматривает 16
и 4
как числа,
пока не достигнет "Вольво"
.
Во втором примере, поскольку первый операнд является строкой, все операнды обрабатываются как строки.
JavaScript типы являются динамическими.
JavaScript имеет динамические типы. Это означает, что одна и таже переменная может использоваться для хранения различных типов данных:
Пример
var x; // x не определен
var x = 5; // x — число
var x = «Андрей»; // x — строка
Редактор кода »
JavaScript строки
Строка (или текстовая строка) представляет собой серию символов, таких как "Андрей Щипунов"
.
Строки пишутся в кавычках. Можно использовать одиночные или двойные кавычки:
Пример
var carName = «Вольво XC60»; // Использование двойных кавычек
var carName = ‘Вольво XC60’; // Использование одиночных кавычек
Редактор кода »
Вы можете использовать кавычки внутри строки, если они не соответствуют кавычкам вокруг строк:
Пример
var answer = «Его зовут ‘Андрей'»; // Одинарные кавычки внутри двойных кавычек
var answer = ‘Его зовут «Андрей»‘; // Двойные кавычки внутри одинарных кавычек
Редактор кода »
Подробнее о строках вы узнаете далее в этом учебнике.
JavaScript числа
JavaScript имеет только один тип чисел.
Числа могут быть записаны с десятичными знаками или без них:
Пример
var x1 = 34.00; // Написано с десятичными знаками
var x2 = 34; // Написано без десятичных знаков
Редактор кода »
Очень большие или очень маленькие числа, можно записать в научной (экспоненциальной) нотации:
Подробнее о числах вы узнаете далее в этом учебнике.
JavaScript логические значения
Булевы могут иметь только два значения: true
или false
.
Пример
var x = 5;
var y = 5;
var z = 6;
(x == y) // Возвращает true
(x == z) // Возвращает false
Редактор кода »
Булевы часто используются при условном тестировании.
Более подробно об условном тестировании вы узнаете далее в этом учебнике.
JavaScript массивы
JavaScript массивы записываются в квадратные скобки.
Элементы массива разделяются запятыми.
Следующий код объявляет (создает) массив cars
, содержащий три элемента (названия автомобилей):
Индексы массивов начинаются с нуля, что означает, что первый элемент [0]
,
второй — [1]
, и так далее.
Подробнее о массивах вы узнаете далее в этом учебнике.
JavaScript объекты
JavaScript объекты записываются в фигурных скобках.
Свойства объекта записываются в виде пары имя:»значение», разделенные запятыми.
Пример
var person = {firstName:»Андрей», lastName:»Щипунов», age:49, eyeColor:»зеленый»};
Редактор кода »
Объект person
в примере выше имеет 4 свойства: firstName
,
lastName
, age
, и eyeColor
.
Более подробно об объектах вы узнаете далее в этом учебнике.
Оператор вызова
Вы можете использовать JavaScript оператор typeof
, вызвать тип переменной JavaScript.
Оператор typeof
возвращает тип переменной или выражения:
Пример
typeof «» // Возвращает «строку»
typeof «Андрей» // Возвращает «строку»
typeof «Андрей Щипунов» // Возвращает «строку»
Редактор кода »
Пример
typeof 0 // Возвращает «число»
typeof 314 // Возвращает «число»
typeof 3.14 // Возвращает «число»
typeof (3) // Возвращает «число»
typeof (3 + 4) // Возвращает «число»
Редактор кода »
Значение undefined
В JavaScript переменная без значения, имеет значение undefined
— неопределенно.
Оператор typeof
также, имеет значение undefined
.
Пример
var car; // Значение неопределенно, тип неопределен
Редактор кода »
Любая переменная может быть очищена, установив значение undefined
.
Тип также будет неопределен.
Пример
car = undefined; // Значение неопределенно, тип неопределен
Редактор кода »
Значение пустое
Пустое значение не имеет ничего общего с неопределенным.
Пустая строка имеет как допустимое значение, так и тип.
Пример
var car = «»; // Значение «», typeof, являться «строкой»
Редактор кода »
Тип данных null
В JavaScript тип данных null
— нуль, являться «ничто».
Это должно быть то, чего не существует.
Но, в JavaScript тип данных null
является объектом.
Вы можете считать это ошибкой в JavaScript, что typeof
null
,
является объектом. Он должен быть null
.
Можно опустошить объект, установив для него значение null
:
Пример
var person = {firstName:»Андрей», lastName:»Щипунов», age:49, eyeColor:»зеленый»};
person = null; // Теперь значение является null, но тип по-прежнему является объектом
Редактор кода »
Также можно очистить объект, установив для него значение undefined
:
Пример
var person = {firstName:»Андрей», lastName:»Щипунов», age:49, eyeColor:»зеленый»};
person = undefined; // Теперь и значение и тип: неопределенны
Редактор кода »
Разница между undefined
и null
undefined
и null
равны по значению, но отличаются по типу:
typeof undefined // неопределенно
typeof null // объект
null === undefined // лож
null == undefined // правда
Редактор кода »
Примитивные данные
Примитивное значение данных — это единственное простое значение данных без дополнительных свойств и методов.
Оператор typeof
может возвратить один из этих примитивных типов:
- строка
- число
- логическое значение
- неопределенно
Пример
typeof «Андрей» // Возвращает «строку»
typeof 3.14 // Возвращает «число»
typeof true // Возвращает «логическое значение»
typeof false // Возвращает «логическое значение»
typeof x // Возвращает «неопределенно» (если x имеет значение)
Редактор кода »
Сложные данные
Оператор typeof
, может возвратить один из двух сложных типов:
- функцию
- объект
Оператор typeof
возвращает объект для обоих объектов, массивов и нуля
Оператор typeof
не возвращает объект для функции.
Пример
typeof {name:’Андрей’, age:49}// Возвращает «объект»
typeof [1,2,3,4] // Возвращает «объект» (не «массив», см. Примечание ниже)
typeof null // Возвращает «объект»
typeof function myFunc(){} // Возвращает «функцию»
Редактор кода »
Оператор typeof
возвратит «объект» для массива,
потому что в JavaScript массивы являются объектами.
JavaScript События | Schoolsw3.com
HTML DOM позволяет JavaScript реагировать на события HTML:
Мышь надо мной
Нажмите
Реагирование на события
JavaScript может быть выполнен, когда происходит событие, например, когда пользователь нажимает на элемент HTML.
Чтобы выполнить код, когда пользователь нажимает на элемент, добавьте код JavaScript в атрибут события HTML:
Примеры событий HTML:
- Когда пользователь щелкает мышкой
- Когда загружается веб страница
- Когда изображение было загружено
- Когда мышь перемещается по элементу
- При изменении поля ввода
- При отправке HTML формы
- Когда пользователь нажимает клавишу
В этом примере содержимое элемента <h2>
изменяется, когда пользователь нажимает на него:
В этом примере функция вызывается из обработчика событий:
Пример
<h2>Нажмите на этот текст!</h2>
<script>
function changeText(id) {
id.innerHTML = «Ооопс!»;
}
</script>
</body>
</html>
Попробуйте сами »
Атрибуты событий HTML
Чтобы назначать события для элементов HTML, вы можете использовать атрибуты событий.
Пример
Назначить событие onclick элементу button:
<button>Попробовать</button>
Попробуйте сами »
В приведенном выше примере функция с именем displayDate
, будет выполняться при нажатии на кнопку.
Назначение событий с помощью HTML DOM
HTML DOM позволяет назначать события элементам HTML с помощью JavaScript:
Пример
Назначить событие onclick элементу button:
<script>
document.getElementById(«myBtn»).onclick = displayDate;
</script>
Попробуйте сами »
В приведенном выше примере функция с именем displayDate
,
назначается элементу HTML с id="myBtn"
.
Функция будет выполнена при нажатии на кнопку.
События onload и onunload
События onload
и onunload
запускаются,
когда пользователь входит на страницу или покидает ее.
Событие onload можно использовать для проверки типа браузера посетителя и версии браузера,
а также загрузки соответствующей версии веб страницы на основе полученной информации.
События onload
и onunload
можно использовать для работы с файлами cookie.
Событие onchange
Событие onchange
, часто используется в сочетании с проверкой полей ввода.
Ниже приведен пример, как использовать onchange
.
Функция upperCase()
вызывается, когда пользователь изменяет содержимое поля ввода.
События onmouseover и onmouseout
События onmouseover
и onmouseout
,
можно использовать для запуска функции при наведении курсора мыши на элемент HTML или его выходе из него:
Мышь надо мной
Попробуйте сами »
События onmousedown, onmouseup и onclick
События onmousedown
, onmouseup
, и onclick
,
являются частями щелчка мыши. Сначала при нажатии кнопки мыши запускается событие onmousedown
,
затем, когда кнопка мыши отпущена, запускается событие onmouseup
, наконец, когда щелчок мыши завершен,
запускается событие onclick
.
Нажмите
Попробуйте сами »
Больше примеров
События onmousedown и onmouseup
Изменение изображения, когда пользователь удерживает нажатой кнопку мыши.
Событие onload
После завершения загрузки страницы отобразится окно предупреждения.
Событие onfocus
Измените цвет фона поля ввода, когда оно получает фокус.
События onmouseover и onmouseout
Изменение цвета элемента при наведении на него курсора.
Ссылка на объект события HTML DOM
Для получения списка всех событий HTML DOM, посмотрите на нашем полном HTML DOM Справочник объект события.