Главная » Файлы » Скрипты
Основы JavaScript
30.11.2009, 11:38
Решил написать эту статью для тех, кто совсем ничего не знает в 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
alert ('Текст')

Чтобы при нажатии на кнопку что-либо происходило, добавим к нему условие:

Code
if (alert ('Текст')) {что будет происходить};

Не забываем заключать всё это в <script> smile

prompt - выводит текст, текстовое поле и кнопки "ОК" и "Отмена"

Code
prompt ('Текст','Текстовое поле')

Так же можно заключить в условие:

Code
if (prompt('Текст','Текстовое поле')) {Что будет происходить при нажатии ОК} else {Что будет происходить при нажатии Отмена};

confirm - выводит текст, кнопку "ОК" и "Отмена"

Code
confirm ('Текст')

Также можно заключить в условие:

Code
if (confirm ('Тектс') {Что будет происходить при нажатии ОК} else {Что будет происходить при нажатии Отмена};

Работа с окнами и другое.

Code
window.location.href='ссылка'

Открывает нужную вам страницу.

Code
window.open('ссылка')

Открывает нужную вам страницу в новом окне.

Code
window.location.reload()

Перезагружает страницу.

Code
window.close()

Закрывает страницу.

Объектная модель CSS в JavaScript.

Code
document.getElementById("id элемента").style.свойство='значение'

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

Выделять элементы можно так:

Code
<div id="id нашего элемента"> код области элемента </div>

Обращение к элементу.

Code
document.getElementById('id').функция

Вот список некоторых функций:

.innerHTML='текст' - вставить нужный вам html-код в контейнер тега

.attr='value' - заменить значение атрибута на нужное вам (например .name='text' заменит/добавит атрибут name со значением text

Также для присваивания значения атрибутов, можно использовать переменные, прописывая их без кавычек.

Переменные.

Переменные задаются следующим способом:

Code
var a='значение'

Функции.

Главный признак функции - она выполниться только тогда, когда она будет вызвана. Вызвать ее можно так:

on*событие*="myFunction()"

Задаются функции следующим образом:

Code
name=function(){ //name - это имя функции
       *сама функция*
};

Метод setTimeout()

Реализует задержку перед выполнением функции.

Code
k=function(){
window.setTimeout('e()',500) // e() это название функции, 500 - время задержки перед ее выполнением в миллисекундах
};
e=function(){
*функция*
};

Также есть метод setInterval. Работает также, как и setTimeout, но вместо задержки делает интервал.

Категория: Скрипты | Добавил: Admin
Просмотров: 1485 | Загрузок: 0 | Рейтинг: 5.0/2
close