Решил написать эту статью для тех, кто совсем ничего не знает в JavaScript. Для начала разберемся, как вставлять Javascript. Это можно сделать двумя способами:
1. Тегами <script>
Code
<script>Тут наш скрипт</script>
Так же можно делать ссылку на готовый *.js-файл:
Code
<script src="Тут ссылка на *.js-файл"></script>
2. Добавляя атрибут on*событие к нужному нам тегу:
Code
<a href="javascript://" onclick="Тут наш скрипт">Я ссылка</a>
Вот примеры событий, которые наиболее часто используются:
load - элемент загружен
Code
<body onload="тут наш скрипт">
Т.е. если элемент body загрузится, то выполнится наш скрипт.
click - клик по элементу
Code
<div onclick="скрипт"></div>
При клике по div'-у выполнится наш скрипт.
mouseover - на элемент наведена мышка
mouseout - с элмента отведена мышка
keyup - пользователь отпустил клавишу
keydown - пользователь нажал клавишу
Как использовать JavaScript?
Для начала разберем методы alert, prompt, confirm.
alert - выводит текст и кнопку "ОК"
Чтобы при нажатии на кнопку что-либо происходило, добавим к нему условие:
Code
if (alert ('Текст')) {что будет происходить};
Не забываем заключать всё это в <script>
Code
prompt - выводит текст, текстовое поле и кнопки "ОК" и "Отмена"
Так же можно заключить в условие:
Code
if (prompt('Текст','Текстовое поле')) {Что будет происходить при нажатии ОК} else {Что будет происходить при нажатии Отмена};
confirm - выводит текст, кнопку "ОК" и "Отмена"
Также можно заключить в условие:
Code
if (confirm ('Тектс') {Что будет происходить при нажатии ОК} else {Что будет происходить при нажатии Отмена};
Работа с окнами и другое.
Code
window.location.href='ссылка'
Открывает нужную вам страницу.
Code
window.open('ссылка')
Открывает нужную вам страницу в новом окне.
Code
window.location.reload()
Перезагружает страницу.
Закрывает страницу.
Объектная модель CSS в JavaScript.
Code
document.getElementById("id элемента").style.свойство='значение'
Пригодится, если вы хотите, например, что бы при клике по кнопке нужное вам свойство элемента принимало определенное значение.
Выделять элементы можно так:
Code
<div id="id нашего элемента"> код области элемента </div>
Обращение к элементу.
Code
document.getElementById('id').функция
Вот список некоторых функций:
.innerHTML='текст' - вставить нужный вам html-код в контейнер тега
.attr='value' - заменить значение атрибута на нужное вам (например .name='text' заменит/добавит атрибут name со значением text
Также для присваивания значения атрибутов, можно использовать переменные, прописывая их без кавычек.
Переменные.
Переменные задаются следующим способом:
Функции.
Главный признак функции - она выполниться только тогда, когда она будет вызвана. Вызвать ее можно так:
on*событие*="myFunction()"
Задаются функции следующим образом:
Code
name=function(){ //name - это имя функции
*сама функция*
};
Метод setTimeout()
Реализует задержку перед выполнением функции.
Code
Code
k=function(){
window.setTimeout('e()',500) // e() это название функции, 500 - время задержки перед ее выполнением в миллисекундах
};
e=function(){
*функция*
Также есть метод setInterval. Работает также, как и setTimeout, но вместо задержки делает интервал
Автор данной статьи - [master]
Копирование без указания автора приведет к взлому сайта, где выложена данная статья.
Сайт: http://ulife.3dn.ru
