Урок 1 Java script

Автор: | 28.08.2015

Для изучения JavaScript Вам необходимо пройти курс «Верстка HTML CSS» и «Программирование на PHP»

Если вы прошли это курсы или не уверены в том нужны они вам или нет. Вы можете проверить уровень своей подготовки пройдя тестирование. Тест HTML CSS PHP.

JavaScript является самым популярным языком программирования в мире. В этом уроке вы увидите несколько несложных примеров о том что умеет делать JS.

Вот например вот такая строчка:

document.getElementById("demo").innerHTML = "Hello JavaScript";

найдет HTML элемент с id= «demo» и поменяет его содержимое на «Hello JavaScript».

А следующая изменит размер шрифта на 25 пикселей:

document.getElementById("demo").style.fontSize = "25px";

В JavaSript очень обширные возможности, и мы будем изучать их в этом курсе.

Теперь приступим непосредственно к первому уроку и напишем нашу первую программу на JavaScript.

 

<script language="JavaScript" type="text/javascript">
function hello_world1() {
  alert('Hello, World!');
}
function hello_world() {
 document.getElementById('test_but').onclick=function(){
  alert('Hello, World!');
 }
}
</script>

<input type='button' value='Test' onClick="javascript: window.alert('test');" id='test_but'><br>
<input type='button' value='Change' onClick="hello_world1()"><br>
<input type='button' value='Magic' id='test_but'>

Итак, что же наша программа делает, спросите вы? Все очень просто. Вкратце: по нажатию на кнопку Test на экране появится всплывающее окно с текстом «test».

По нажатию на кнопку Change или Magic на экране тоже появится всплывающее окно но с текстом «Hello, World!».

Но в чем разница? Разница в том, что в первом случае мы вызываем всплывающее окно напрямую в кнопке, а во втором и в третьем случае мы вызываем функцию написанную отдельно, которое собственно и вызывает всплывающее окно, но если к кнопке Magic мы обращаемся непосредственно из функции hello_world() ,то в кнопке Change мы вызываем функцию hello_world1() с помощью атрибута  onClick.