Введение в JavaScript для Мага
Шрифт:
Если теперь в новом окне Вы нажмете кнопку, то оно будет закрыто.
open и close — это методы объекта window. Мы должны помнить, что следует писать не просто open и close, а window.open и window.close. Однако в нашем случае объект window можно опустить — Вам нет необходимости писать префикс window, если Вы хотите всего лишь вызвать один из методов этого объекта (и такое возможно только для этого объекта).
Динамическое создание документов
Теперь мы готовы к рассмотрению такой замечательной возможности JavaScript, как динамическое создание документов. То есть Вы можете разрешить Вашему
Для начала мы создадим простой HTML-документ, который покажем в новом окне. Рассмотрим следующий скрипт.
<html>
<head>
<script language="JavaScript">
<!- hide
function openWin3 {
myWin= open("", «displayWindow»,
"width=500,height=400,status=yes,toolbar=yes,menubar=yes");
// открыть объект document для последующей печати
myWin.document.open;
// генерировать новый документ
myWin.document.write("<html><head><title>On-the-fly");
myWin.document.write("</title></head><body>");
myWin.document.write("<center><font size=+3>");
myWin.document.write("This HTML-document has been created ");
myWin.document.write("with the help of JavaScript!");
myWin.document.write("</font></center>");
myWin.document.write("</body></html>");
// закрыть документ — (но не окно!)
myWin.document.close;
}
// — >
</script>
</head>
<body>
<form>
<input type=button value="On-the-fly" onClick="openWin3">
</form>
</body>
</html>
Начало формы
Конец формы
Давайте рассмотрим функцию winOpen3 . Очевидно, мы сначала открываем новое окно браузера. Поскольку первый аргумент функции open — пустая строка (""), то это значит, что мы не желаем в данном случае указывать конкретный адрес URL. Браузер должен только не обработать имеющийся документ — JavaScript обязан создать дополнительно новый документ.
В скрипте мы определяем переменную myWin. И с ее помощью можем получать доступ к новому окну. Обратите пожалуйста внимание, что в данном случае мы не можем воспользоваться для этой цели именем окна (displayWindow).
После того, как мы открыли окно, наступает очередь открыть для записи объект document. Делается это с помощью команды:
// открыть объект document для последующей печати
myWin.document.open;
Здесь мы обращаемся к open — методу объекта document. Однако это совсем не то же самое, что метод open объекта window! Эта команда не открывает нового окна — она лишь готовит document к предстоящей печати. Кроме того, мы должны поставить перед document.open приставку myWin, чтобы получить возможность писать в новом окне.
В последующих строках скрипта с помощью вызова document.write формируется текст нового документа:
// генерировать новый документ
myWin.document.write("<html><head><title>On-the-fly");
myWin.document.write("</title></head><body>");
myWin.document.write("<center><font size=+3>");
myWin.document.write("This HTML-document has been created ");
myWin.document.write("with the help of JavaScript!");
myWin.document.write("</font></center>");
myWin.document.write("</body></html>");
Как видно, здесь мы записываем в документ
обычные тэги языка HTML. То есть мы фактически генерируем разметку HTML! При этом Вы можете использовать абсолютно любые тэги HTML.По завершении этого мы обязаны вновь закрыть документ. Это делается следующей командой:
// закрыть документ — (но не окно!)
myWin.document.close;
Как я уже говорил, Вы можете не только динамически создавать документы, но и по своему выбору размещать их в в том или ином фрейме. Например, если Вы получили два фрейма с именами frame1 и frame2, а теперь во frame2 хотите сгенерировать новый документ, то для этого в frame1 Вам достаточно будет написать следующее:
parent.frame2.document.open;
parent.frame2.document.write("Here goes your HTML-code");
parent.frame2.document.close;
Динамическое создание VRML-сцен
Чтобы продемонстрировать гибкость языка JavaScript, давайте теперь попытаемся динамически создать сцену на языке VRML. Напомним, что аббревиатура VRML расшифровывается как язык моделирования виртуальной реальности. То есть это язык для создания трехмерных сцен. Можно, например, взять очки виртуальной реальности и наслаждиться прогулкой по таким сценам… Возьмем самый простой пример — голубой куб.
Тем не менее, чтобы рассмотреть его, понадобится программная приставка VRML к Вашему браузеру (plug-in). Предлагаемый Вашему вниманию скрипт не проверяет, а доступен ли браузеру plug-in VRML (впрочем сделать это — вовсе не проблема).
Исходный код скрипта:
<html>
<head>
<script language="JavaScript">
<!- hide
function vrmlScene {
vrml= open("", «displayWindow»,
"width=500,height=400,status=yes,toolbar=yes,menubar=yes");
// открыть document для последующего вывода информации
vrml.document.open("x-world/x-vrml");
vr= vrml.document;
// создать сцену VRML
vr.writeln("#VRML V1.0 ascii");
// Освещение
vr.write("Separator { DirectionalLight { ");
vr.write("direction 3–1 -2.5 } ");
// Камера
vr.write("PerspectiveCamera { position -8.6 2.1 5.6 ");
vr.write("orientation -0.1352 -0.9831 -0.1233 1.1417 ");
vr.write("focalDistance 10.84 } ");
// Куб
vr.write("Separator { Material { diffuseColor 0 0 1 } ");
vr.write("Transform { translation -2.4.2 1 rotation 0 0.5 1.9 } ");
vr.write("Cube {} } }");
// Закрыть document — (но не окно!)
vrml.document.close;
}
// — >
</script>
</head>
<body>
<form>
<input type=button value="VRML on-the-fly" onClick="vrmlScene">
</form>
</body>
</html>
Как видно, текст скрипта совершенно такой же, как и в предыдущем примере. Сперва открывается новое окно. Затем мы открываем document для вывода него информации. Рассмотрим поподробнее соответствующую команду:
// открыть document для последующего вывода информации
vrml.document.open("x-world/x-vrml");
В предыдущих примерах мы не указывали в скобках ничего. Что же тогда означает новая запись "x-world/x-vrml"? На самом же деле, с помощью этой инструкции мы задаем тип MIME для документа, который хотим создать. То есть, тем самым мы сообщаем браузеру, какого типа данные будут ему сейчас переданы. Если же мы в этом месте не определили в скобках конкретный тип MIME, то по умолчанию для нового документа будет выбран тип "text/html" (а это как раз и есть тип MIME для файлов HTML).