JavaScript Tutorial/Window/Introduction

Материал из Web эксперт
Версия от 08:24, 26 мая 2010; Admin (обсуждение | вклад) (1 версия)
(разн.) ← Предыдущая | Текущая версия (разн.) | Следующая → (разн.)
Перейти к: навигация, поиск

Creating Windows

The open method can be used to create any primary or secondary window.



window.open("web.html", "newWin", "resizeable,menubar,toolbar");


This creates a window that is resizable, contains a menu bar, and has a toolbar.

The "web.html" is the file that will open in the newly created window.

"newWin" represents the name of the window object.

Other features include outerHeight, outerWidth, innerHeight, innerWidth, alwaysRaised, alwaysLowered, location, screenY, and screenX.

The features are specified in the parameters of the open function.

Parent Code for Window Example

<HTML>
    <HEAD>
    <TITLE> Window Example - Parent</TITLE>
    <SCRIPT LANGUAGE="Javascript">
    <!--
    function openWin(){
      childWin=open("child.htm", "ChildWin", "toolbar,scrollbars,menubar,status,innerwidth=250,innerheight=350");
    }
    function sendToChild(){
      childWin.document.childForm.childText.value = document.parentForm.parenttext.value;
    }
    // End Hide-->
    </SCRIPT>
    </HEAD>
    <BODY>
    <P>
    <CENTER>
    <B>Window Example - Parent Window</B>
    <BR><BR><BR>
    </CENTER>
    <FORM NAME="parentForm">
    Click on the Button below to open a Child window:
    <BR><BR>
    <INPUT TYPE="button" NAME="submit" VALUE="Open Child Window" onclick="openWin()">
    <BR><BR><BR>
    <TABLE>
    <TR><TD ALIGN=left>
    <INPUT TYPE="text" NAME="parenttext" size=45></TD>
    <TD ALIGN=left>
    <INPUT TYPE="button" NAME="submit" VALUE="Send To Child" onclick="sendToChild()">
    </TD>
    </TR>
    <TR><TD ALIGN=left>
    <INPUT TYPE="text" NAME="received" size=45></TD>
    <TD ALIGN=left>
    This text comes from the child.
    </TD>
    </TR>
    </TABLE>
    </FORM>
    <BR><BR><BR>
    </BODY>
    </HTML>


Window Object Properties Array

<HTML>
<HEAD>
   <TITLE>Window Object Properties Array</TITLE>
</HEAD>
<BODY>
<SCRIPT>
for (var i in window) {
  document.write ("Window property(" + i +  "): " +
     window[i] + "<BR>");
}
</SCRIPT>
</BODY>
</HTML>


Windows in Action

The window object is one level higher than the document object in the JavaScript object hierarchy.

The window object can manipulate the current window as well as create new window instances.

If window B is created by window A, window B is considered a child of window A.



<html>
    <body>
    <script language="JavaScript">
    <!--
    function create(){
       open("http://www.wbex.ru", "myChild");
    }
    -->
    </script>
    <form name="form1">
    <input type="button" value="Create Child" onClick="create()">
    </form>
    </body>
    </html>