Wiki-учебник по веб-технологиям: JavaScript/СозданиеОперативныхДокументов ...

Главная | Каталог |

Создание оперативных документов


Сейчас Мы дошли до замечательного свойства JavaScript — создание оперативных документов. Это означает, что вы можете позволить вашему JavaScript коду создать новую HTML-страницу. Кроме того вы можете создавать другие документы — подобно VRML-сценам и т.д. Вы можете выводить эти документы в отдельном окне или во фрейме.

Сначала мы создадим простой HTML-документ, который будет отображаться в новом окне. Сценарий уже есть, и нам необходимо на него взглянуть.

<html>
<head>
<script language="JavaScript">
<!-- hide

function openWin3() {
  myWin= open("", "displayWindow", 
    "width=500,height=400,status=yes,toolbar=yes,menubar=yes");

  // open document for further output
  myWin.document.open();
  
  // create document
  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>");

  // close the document - (not the window!)
  myWin.document.close();  
}

// -->
</script>
</head>
<body>

<form>
<input type=button value="On-the-fly" onClick="openWin3()">
</form>

</body>
</html>


Давайте посмотрим на функцию winOpen3(). Вы можете видеть, что мы открываем новое окно браузера сначала. Как вы видете, что первый параметр – пустая строка “ " – это значит, что мы не определяем URL. Окно просмотра не просто должно выбрать существующий документ — JavaScript создаст новый документ.

Мы определяем переменную myWin. С помощью этой переменной мы можем обращаться к новому окну. Пожалуйста обратите внимание, что мы не можем использовать имя окна (displayWindow) для этой задачи.

После открытия окна мы должны открыть документ. Это выполняется следующим образом:

// open the document
  myWin.document.open();


Мы вызываем метод open() document-объекта — отличающийся метод от open() window-объекта! Эта команда не открывает новое окно — она готовит документ для дальнейшего вывода.

Мы должны поместить myWin перед document.open() чтобы обратиться к новому окну.

Следующие строки создают документ с помощью document.write():

// create document
  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-теги.
После вывода, мы снова должны закрыть документ. Следующий код делает это:

// close the document - (not the window!)
  myWin.document.close();


Как я уже говорил вам ранее, вы можете создавать оперативные документы и также отображать их во фрейме. Например, если вы имеете два фрейма с именами frame1 и frame2, и хотите создать новый документ во frame2, который вы можете написать следующее во frame1:

parent.frame2.document.open();
 
parent.frame2.document.write("Here goes your HTML-code");
 
parent.frame2.document.close();