Вариация первая: самый простая
На первом этапе мы составим программу JavaScript, которая вставит слова “Hello, world!” непосредственно в документ HTML (рис. 1.1).
Рис. 1.1. Внешний вид документа HTML с первой программой на JavaScript
Как мы уже говорили, программы или сценарии JavaScript встраиваются в документ HTML. Взгляните на листинг 1.1, в котором мы привели исходный текст документа с нашей первой программой, составленной на JavaScript.
Листинг 1.1. Файл chapter1/hello/hello.html
<HTML>
<HEAD>
<TITLE>Hello, world!</TITLE>
</HEAD>
<BODY BGCOLOR=white>
<H1>JavaScript Test</H1>
<SCRIPT LANGUAGE="JavaScript">
<!--
document.write("Hello, world!");
-->
</SCRIPT>
</BODY>
</HTML>
Как и подобает любому документу HTML, он ограничен операторами <HTML>, </HTML> и состоит из двух разделов. Раздел заголовка выделяется операторами <HEAD> и </HEAD>, а раздел тела документа - операторами <BODY BGCOLOR=white> и </BODY>. В литературе операторы языка HTML часто называют тегами.
В заголовке нашего документа нет ничего необычного. Оператор <BODY BGCOLOR=white> устанавливает белый цвет фона документа, а операторы <H1> и </H1> задают стилевое оформление первой строки документа “JavaScript Test”, которая служит строкой заголовка первого уровня.
Что же касается собственно программы JavaScript, то в нашем первом примере она встроена в документ HTML при помощи операторов <SCRIPT> и </SCRIPT>, как это показано ниже:
<SCRIPT LANGUAGE="JavaScript">
<!--
document.write("Hello, world!");
// -->
</SCRIPT>
С помощью оператора <SCRIPT> вы можете встроить в документ сценарий, составленный на языке JavaScript или VBScript. Язык указывается с помощью параметра LANGUAGE. Заметим, что для сценария на JavaScript допустимо указывать язык LiveScript - предок JavaScript. Такая возможность предусмотрена для обратной совместимости.
Текст сценария мы оформили как комментарий с применением операторов <!-- и -->. Это сделано для того чтобы наш сценарий не вызывал проблем у пользователей, браузеры которых не могут работать с JavaScript. Такие браузеры просто проигнорируют наш сценарий.
Обращаем также ваше внимание на строку, которой завершается комментарий:
// -->
Перед символами --> мы записали два символа /. Поясним, зачем это сделано.
Интерпретаторы языка JavaScript, встроенные в Microsoft Internet Explorer и Netscape Navigator, игнорируют символы -->, отмечающие начало комментария в документе HTML. Что же касается символов -->, то здесь поведение основных конкурирующих браузеров различается. Microsoft Internet Explorer игнорирует строку, состоящую только из символов -->, а Netscape Navigator рассматривает ее как ошибочную.
Для того чтобы обеспечить работоспособность нашего сценария в различных браузерах, мы добавили к строке --> два символа /, которые применяются в JavaScript для выделение комментариев наряду с известной из языка С конструкцией /*...*/.
Наша первая программа весьма проста и содержит только одну строку:
document.write("Hello, world!");
Здесь для объекта с именем document вызывается метод write. В качестве параметра ему передается текстовая строка "Hello, world!". Строка закрывается символом точка с запятой, хотя этот символ может и отсутствовать.
Объект document - это документ HTML, загруженный в окно браузера. Он содержит в себе объекты, свойства и методы, предназначенные для работы с элементами этого документа HTML, а также для взаимодействия с другими объектами.
Подробнее об этом мы расскажем позже, а сейчас отметим только, что метод write нашей программы записывает в тело документа HTML приветственную строку "Hello, world!". При этом документ будет выглядеть так, как будто эта строка находится в нем на месте сценария:
<HTML>
<HEAD>
<TITLE>Hello, world!</TITLE>
</HEAD>
<BODY BGCOLOR=white>
<H1>JavaScript Test</H1>
Hello, world!
</BODY>
</HTML>
Интерпретатор HTML, встроенный в браузеры, допускает использование в документах HTML строчных или прописных символов, не делая между ними различия. Однако интерпретатор JavaScript делает такие различия, поэтому составляя программу JavaScript, вы должны это учитывать.
