Вариация вторая: с подгружаемым исходным текстом

Лабораторная работа № 1. Исследование возможностей встраивания JavaScript в WEB-страницу.

Вариации на тему Hello, world!

Начнем изучение нового языка программирования с классической программы Hello, world!, впервые составленной создателями языка С. Рассмотрим несколько вариантов такой программы, демонстрирующих различные возможности JavaScript.

Вариация первая: самая простая

На первом этапе мы составим программу JavaScript, которая вставляет слова Hello, world! непосредственно в документ HTML. Программы или сценарии JavaScript встраиваются в документ HTML. Взгляните на листинг 1.1, в которой приведен исходный текст документа с программой, составленной на JavaScript.

Листинг 1.1.

Hello, world!

Как и подобает любому документу HTML, он ограничен операторами ,и состоит из двух разделов. Раздел заголовка выделяется операторамии , а раздел тела документа — операторамии . Программа JavaScript этом примере встроена в тело документа HTML при помощи операторови , как это показано ниже:

С помощью оператораможно встроить в документ сценарий, составленный на языке JavaScript или VBScript. Язык указывается с помощью параметра LANGUAGE. Текст сценария оформлен как комментарий с применением операторов . Это сделано для того, чтобы сценарий не вызывал проблем у пользователей, браузеры которых не могут работать с JavaScript. Такие браузеры просто проигнорируют сценарий. Обратите внимание на строку, которой завершается комментарий: // — Перед символами — записаны два символа /. Это позволяет обеспечить работоспособность сценария в различных браузерах. Некоторые из них (например, Netscape Navigator) в сценариях JavaScript рассматривают строку — как ошибочную. Символы // используются в JavaScript для выделения комментариев и предписывают браузерам игнорировать символы, записанные после них (в том числе и —). Для обозначения комментариев можно использовать также конструкцию /*…*/. Этот способ удобен, если комментарий содержит несколько строк.

Наша первая программа весьма проста и содержит только одну строку:

document.write(Hello, world!);

Здесь для объекта с именем document вызывается метод write. В качестве параметра ему передается текстовая строка Hello, world!. Строка закрывается символом точка с запятой, хотя этот символ может и отсутствовать. Объект document — это документ HTML, загруженный в окно браузера. Он содержит в себе объекты, свойства и методы, предназначенные для работы с элементами этого документа HTML, а также для взаимодействия с другими объектами. Метод write записывает в тело документа HTML приветственную строку Hello, world!. При этом документ будет выглядеть так, как будто эта строка находится в нем на месте сценария:

Hello, world!Hello, world!

Вариация вторая: с подгружаемым исходным текстом

Исходный текст любого сценария должен включаться в документы HTML. Однако, есть техническая возможность оформлять программы на JavaScript в отдельных файлах, а в страницах HTML указывать на эти файлы ссылки. Браузер, загружая оформленные подобным образом HTML документы, загружает оформленные в отдельных файлах сценарии и подставляет их вместо соответствующих ссылок. Такой способ включения JavaScript сценариев удобен, если один и тот же сценарий должен быть включен во множество документов HTML, или же если есть необходимость скрыть исходный код от просмотра пользователями (через просмотр источника).

Ссылки на файлы с подгружаемыми скриптами оформляются с помощью параметра SRC тега , допускающего указывать адрес URL файла сценария. Следующий пример демонстрирует использование параметра SRC. В листинге 1.2 находится исходный текст документа HTML, содержащий ссылку на файл сценария hello.js.

Листинг 1.2.

Hello, world!

Ссылка оформлена с применением операторови , однако между этими операторами нет ни одной строчки исходного текста. Этот текст перенесен в файл hello.js (листинг 1.3).

Статьи к прочтению:

Обтекание картинки текстом в CorelDRAW, Illustrator, Photoshop, Indesign

Похожие статьи: