Учебни записки

5. JavaScript

JavaScript е език за програмиране. (Не го бъркайте с езика Java!)

На този език най-често се пишат скриптове - програми, изпълнявани от браузъра, с който се разглежда дадена уебстраница. Затова се казва, че JavaScript е скрипнотов език. Задачата на тези програми е да реагират на действия на потребителя и да предизвикват промени в отворената страница, които е предвидено да настъпват при тези действия.

JavaScript е скриптовият език по подразбиране, предвиден от спецификацията HTML5. Това означава, че стандартната версия на този език се разпознава и изпълнява от всички съвременни браузъри, както за настолни, така и за мобилни устройства.

Редове програмен код на езика JavaScript може да се вмъкват в HTML кода, по три начина:

1. В рамките на стойността на атрибут, на HTML таг

Съществуват атрибути на html таговете, предвидени да указват какви действия да се извършат над съответния елемент при определени събития. Събитията са неща които може да се случат или не по време на зареждането или разглеждането на уебстраница. Всяко събитие носи определено име, започващо с представката on. Примери за имена на събития:

onload - събитие, което настъпва щом приключи зареждането на страницата,
onchange - настъпване на промяна в съдържанието на поле за попълване,
onclick - случва се, когато потребителят щраква с мишката (докосва с пръст върху чувствителен на допир екран) елемента,
onmouseover - курсорът на мишката навлиза в рамките на елемента,
onmouseout - курсорът на мишката напуска рамките на елемента,
onkeydown - потребителят е натиснал клавиш от клавиатурата.

Имената на събитията се използват като имена на атрибути, които се вмъкнат в отварящия таг на елемента. Стойностите на тези атрибути са програмен код на Javascript, който описва какво да се изпълни от браузъра при съответното събитие.

Пример за вмъкване на JavaScript, в атрибута на елемент:

<p onmouseover="this.style.color='red';" onmouseout="this.style.color='green';">Този абзац става червен при навлизане на курсора в него и зелен - при напускане.</p>

2. В рамките на таг <script></script>

В рамките на стойността на атрибут не е удобно да се пише дълъг програмен код, ето защо е предвиден специален HTML таг, в който може да се направи това. Изнасянето на по-дълъг код извън атрибутите на таговете, освен това, позволява един и същи код да се изпълнява при събития настъпващи в различни елементи. Пример, при който с помощта на таг <script> се постига поведение като в предишния пример в два абзаца текст:

<script>
function redColor(a){
a.style.color="red";
}
function greenColor(a){
a.style.color="green";
}
</script>

<p onmouseover="redColor(this);" onmouseout="greenColor(this);">Абзац 1<p>

<ponmouseover="redColor(this);" onmouseout="greenColor(this);">Абзац 2<p>

3. В отделни файлове

Скриптов програмен код може да се предостави за изпълняване в различни страници на сайта, като се запази в отделен файл и в HTML кода на страниците се вмъква таг с име script, който посочва този файл. Например:

<script src="myScript.js"></script>

Атрибутът с име src на този таг посочва URL-а на файла, съдържащ програмен код на език JavaScript.

 

Вижте: JavaScript Tutorial