myFunction();
// — >
</script>
</html>
В этом скрипте мы определили некую функцию, состоящую из следующих строк:
function myFunction() {
document.write('Добро пожаловать на мою страницу!<br>');
document.write('Это JavaScript!<br>');
}
Все команды скрипта, что находятся внутри фигурных скобок — {} — принадлежат функции
Поскольку это довольно простой пример использования функции, то у Вас мог возникнуть вопрос, а почему собственно эти функции столь важны в JavaScript. По прочтении данного описания Вы конечно же поймете их пользу. Именно возможность передачи переменных при вызове функции придает нашим скриптам подлинную гибкость — что это такое, мы увидим позже.
Функции могут также использоваться в совместно с процедурами обработки событий. Рассмотрим следующий пример:
<html>
<head>
<script language='JavaScript'>
<!- hide
function calculation() {
var x= 12;
var y= 5;
var result= x + y;
alert(result);
}
// — >
</script>
</head>
<body>
<form>
<input type='button' value='Calculate' onClick='calculation()'>
</form>
</body>
</html>
Here you can test this example:
Здесь при нажатии на кнопку осуществляется вызов функции
Часть 2: Документ HTML
Иерархия объектов в JavaScript
В языке JavaScript все элементы на web-странице выстраиваются в иерархическую структуру. Каждый элемент предстает в виде объекта. И каждый такой объект может иметь определенные свойства и методы. В свою очередь, язык JavaScript позволит Вам легко управлять объектами web-страницы, хотя для этого очень важно понимать иерархию объектов, на которые опирается разметка HTML. Как это все действует, Вы сможете быстро понять на следующем примере. Рассмотрим простую HTML-страницу:
<html>
<head>
<title>My homepage
</head>
<body bgcolor=#ffffff>
<center>
<img src='home.gif' name='pic1' width=200 height=100>
</center>
<p>
<form name='myForm'>
Name:
<input type='text' name='name' value=''><br>
e-Mail:
<input type='text' name='email' value=''><br><br>
<input type='button' value='Push me' name='myButton' onClick='alert('Yo')'>
</form>
<p>
<center>
<img src='ruler.gif' name='pic4' width=300 height=15>
<p>
<a href='http://rummelplatz.uni-mannheim.de/~skoch/'>My homepage</a>
</center>
</body>
</html>
А вот как выглядит эта страница на экране (я добавил к ней еще красным цветом комментарии):
Итак, мы имеем два рисунка, одну ссылку и некую форму с двумя полями для ввода текста и одной кнопкой. С точки зрения языка JavaScript окно браузера — это некий объект
