Properties and methods of window objects:
Format:
[Window.] Properties
[Window.] method (parameter)
Opener. Attribute
Opener. Method (parameter)
Self. Attributes
Self. Method (parameter)
Parent. Attribute
Parent. Method (parameter)
Top. Attributes
Top. Method (parameter)
Window name. Properties
Window name. Method (parameter)
Properties of window objects:
Document Information of the current file
Location Information of the current URL
Name window name
Temporary status information
Defaultstatus status bar default information
History the web page recently viewed in this window
Closed checks whether the window is closed and returns a Boolean value.
Source window of the window opened by the opner open method
The vertical size of the outerheight window boundary, PX
Horizontal size of the outerwidth window boundary, PX
Position of pagexoffset webpage X-Position
Position of page y-position in pageyoffset
The vertical size of the innerheight window content area, PX
The horizontal size of the innerwidth window content area, PX
X coordinate of the left boundary of the screenx window
Y coordinate of the upper boundary of the screeny window
Self current window
Top-most window
Framework Group of the current window or framework of the parent
Frames maps to the frame in the window.
Number of length Frames
Address Bar of the locationbar Browser
Menubar browser menu bar
Scrollbars browser scroll bar
Statusbar browser Status Bar
Toolbar browser toolbar
Whether offscreenbuffering updates the area outside the window
Personal Toolbar of the personalbars browser, only Navigator
Window object method:
Alert (Information string) prompts a warning message
Confirm (Information string) display confirmation dialog box
Prompt (prompt string [, default value]) displays prompt information and provides input fields
Atob (Decoding string) decodes the base-64 encoding string
Btoa (string) will undergo base-64 Encoding
Back () back to the previous page of history
Forward () loads the next page in the history
Open (URL, window name [, window type])
Focus () Move focus to this window
Blur () window turns into background
Stop () Stop loading Web pages
Close ()
Enableexternalcapture () allows window with framework to obtain events
Disableexternalcapture () Disable enableexternalcapture ()
Captureevents (Event Type) captures specific events in the window
Routeevent transfers captured events
Handleevent makes the processing of a specific event take effect
Releaseevents (Event Type) Release acquired events
Relative positioning of moveBy (horizontal points, vertical points)
Absolute positioning of moveTo (x coordinate, Y coordinate)
Setresizable (true | false) whether to allow window size adjustment
ResizeBy (horizontal points, vertical points) to adjust the window size
ResizeTo (width, height) Absolutely adjusts the window size
Scroll (x coordinate, Y coordinate) Absolute scroll window
Scrollby (horizontal points, vertical points) Relative scrolling window
Scrollto (x coordinate, Y coordinate) Absolute scrolling window
Setinterval (expression, millisecond)
SetTimeout (expression, millisecond)
Clearinterval (timer object)
Cleartimeout (timer object)
Home () enter the home page of browser settings
Find ([String [, casesensitivr, backward]) Find the specific string in the window
Print ()
Sethotkeys (true | false)
Setzoptions () sets the stack sequence when the window overlaps
Event Processing of window objects Program :
Onblur ondragdrop onerror onfocus onload onmove onresize onUnload
Example 1:
<SCRIPT>
Function checkpassword (testobject ){
If (testobject. value. Length <4 ){
Alert ("password length cannot be less than four ");
Testobject. Focus ();
Testobject. Select ();
}
}
</SCRIPT>
Enter the password:
<Input type = "text" onblur = "checkpassword (this)">
Example 2:
<SCRIPT>
If (confirm ("are you 18 years old? "))
Location = "adult.htm ";
Else
Alert ("come back when you are an adult! ");
</SCRIPT>
Example 3:
<SCRIPT>
VaR bgcolor =
Prompt ("which background do you like: \ n light blue press 1, pink press 2", 1)
If (bgcolor = 1) document. bgcolor = "# ccffff ";
Else if (bgcolor = 2) document. bgcolor = "# ffccff ";
Else document. bgcolor = "# ffffff ";
</SCRIPT>
Example 4:
<SCRIPT>
Function grow (){
ResizeBy (0, 50 );
}
Function shrink (){
ResizeBy (0,-50 );
}
</SCRIPT>
<Body onmouseover = "grow ()" onmouseout = "shrink ()">
Zoom in and out windows
</Body>
Example 5:
<SCRIPT>
Function scrollit (){
For (y = 1; y <= 2000; y ++ ){
Scrollto (1, y );
}
}
</SCRIPT>
<Body ondblclick = scrolclick ()>
Double-click the mouse to automatically scroll the screen...
<Br> <BR>
<Br> <BR>
<Br> <BR>
<Br> <BR>
... The end...
</Body>
Window specification parameters of the Open Method: (Yes/No, 1/0)
Format: [Var new window object name =] window. Open ("url", "windowname", "windowfeature ") Whether alwayslowered pushes the stack displayed in the window to a layer
Whether alwaysraised pushes the stack displayed in the window to a layer
Whether the dependent depends on the current window.
Whether fullscreen is full screen display
Whether directories displays the connection Toolbar
Location: Indicates whether to display the URL toolbar.
Does menubar display the menu toolbar?
Whether scrollbars displays the scroll bar
Status indicates whether the status bar is displayed.
Whether titlebar displays the title bar
Whether the toolbar displays the Standard toolbar
Can resizable change the window size?
Screenx left boundary distance of the window
Screeny window upper boundary distance
Top Window upper boundary
Width window width
Height window height
Left Border of the window
Outerheight the height of the boundary outside the window
Whether the personal toolbar is displayed in the personalbar
Note: open ("", "", "menubar ")
Open ("", "", "menubar = 1 ")
Open ("", "", "menubar = yes ")
Example 1:
<SCRIPT>
Document. Write ("Wenge Network Technology Learning Network ");
Open ('1.htm', '', 'height = 100, width = 300 ');
</SCRIPT>
<! -------- 1.htm -------->
<Title> welcome </title>
<Body onclick = "self. Close ()">
<Center>
<Font color = "blue" size = "5"> welcome </font> <br>
This is a small place for technical study <br>
</Center>
</Body>
Example 2:
<SCRIPT>
Document. Write ("Wenge Network Technology Learning Network ")
Hellowin = open ('1.htm', '', 'height = 100, width = 300 ');
VaR line1 = "<font color = 'blue' size = '5'> welcome </font> <br>"
VaR line2 = "this is a technology study world"
Hellowin.doc ument. Write (line1 + line2)
Hellowin.doc ument. Title = "welcome"
</SCRIPT>
Example 3:
<SCRIPT>
Window. defaultstatus = "the best online learning website ";
</SCRIPT>
<A href = "http://www.hubert.idv.tw" onmouseover = "status = 'Very informative! '; Return true ">
Wenge Network Technology Learning Network </a>
Example 4:
<SCRIPT>
Querywin = open('1.htm', '', 'height = 100 ,')
</SCRIPT>
Use the Child Window to change the background color of the parent window
/* -------- 1.htm --------*/
<SCRIPT>
Function passtoopener (color ){
Opener.doc ument. bgcolor = color;
Self. Close ();
}
</SCRIPT>
<Center>
Select the color you like? <Br>
<Font onclick = "passtoopener ('# ccffff')"> light blue </font>
<Font onclick = "passtoopener ('# ffccff')"> light red </font>
</Center>
Screen Object:
Describes the display and color properties of the screen.
Properties of the Screen Object:
Format: screen. Properties
Availheight available height in the screen area
Availwidth available width of the screen area
Colordepth color depth 256/8 16/16 32 M/32
Height the actual height of the screen area
Width: the actual width of the screen area.
Example 1:
<SCRIPT>
With (document ){
Write ("your screen display settings are as follows: <p> ");
Write ("the actual screen height is", screen. availheight, "<br> ");
Write ("the actual screen width is", screen. availwidth, "<br> ");
Write ("the color disk depth of the screen is", screen. colordepth, "<br> ");
Write ("the height of the screen area is", screen. Height, "<br> ");
Write ("the width of the screen area is", screen. width );
}
</SCRIPT>
Example 2:
<SCRIPT>
If (screen. width <800 | screen. colordepth <8 ){
VaR MSG = "the best browsing mode for this website is 800*600*256 ";
Alert (MSG );
}
</SCRIPT> event object:
when an event occurs, the browser automatically creates the event, including the event type and mouse coordinates.
attribute of the event object:
Format: event. attribute
data returns the URL string (dragdrop) of the drag object)
width the height of the window or frame
height the height of the window or frame
horizontal position of the pagex cursor relative to the webpage
vertical Position
the horizontal position of the screenx cursor relative to the screen
the vertical position of the screeny cursor relative to the screen
target the object to which the event is sent
type event type
the keyboard or mouse key expressed by the which value: 1/2/3 (left/middle/right)
horizontal position of the layerx cursor relative to the event occurrence layer
vertical position of the layery cursor relative to the event occurrence layer
X is equivalent to layerx
Y is equivalent to layery
Example 1:
Example 2:
<SCRIPT>
Function getcoordinate (evnt ){
If (document. All ){
X = event. screenx;
Y = event. screeny;
}
Else {
X = evnt. screenx;
Y = evnt. screeny;
}
Status = "horizontal coordinates:" + x + "; vertical coordinates:" + Y;
}
Document. onmousemove = getcoordinate;
</SCRIPT>
Example 3:
<SCRIPT>
Function whichkey (evnt ){
If (document. All ){
X = event. Button;
If (x = 1) Alert ("You clicked the left button ");
If (x = 2) Alert ("right-click ");
}
Else {
X = evnt. Button;
If (x = 1) Alert ("You clicked the left button ");
If (x = 3) Alert ("right-click ");
Return false;
}
}
Document. onmousedown = whichkey;
Document. Write ("right-click the left button ");
</SCRIPT>
Historical objects:
Used to store the list of recently accessed URLs of the client.
Format:
History. Attribute
History. Method (parameter)
Attributes of historical objects:
Current URL of the Current History
Length: the number of URLs stored in the record list
Next, the URL of the next historical record
Previous historical website of previous
Methods for historical objects:
Back () back to the URL in the previous history
Forward () returns to the URL in the next history
Go (integer or URL) to go to the URL in the history
Example 1:
History. Go (-1)
Newwin. History. Back ()
Parent. downframe. histroy. Back ()
Example 2:
<A href = "#" onclick = "history. Back ()"> previous page </a>
<A href = "javascript: history. Back ()"> previous page </a> Location object:
Indicates the URL Information of a specific window.
Format:
Location. Attribute
Location. Method (parameter) URL format:
Protocol // host: Port/path # hash? Search
URL type:
Javascript: javascript Program Code
View-source: Display Source code
HTTP:
File:
FTP:
Mailto:
News:
Gopher
Location object attributes:
Hash anchor name
Host Name
Hostname HOST: Port
Complete href url string
Pathname path
Port
Protocol
Search query information
Location object method:
Reload () Reload
Replace (URL) replaces the current webpage with the specified webpage
Example 1:
Click the button to go to Wenge Network Technology Learning Network. <p>
<Input type = "button" value = "Let's go! "Onclick =" location. href = 'HTTP: // www.hubert.idv.tw/'">
Example 2:
<Font color = "red"
Onclick = "location = 'HTTP: // www.hubert.idv.tw/'">
Wenge Network Technology Learning Network </font> <p>
<Font color = "blue" style = "cursor: hand"
Onclick = "location = 'HTTP: // www.hubert.idv.tw/'">
Wenge Network Technology Learning Network </font>
Example 3:
<SCRIPT>
VaR sec = 5;
Function countdown (){
If (SEC> 0 ){
Num. innerhtml = sec --;
}
Else
Location = "http://www.hubert.idv.tw /";
}
</SCRIPT>
<Body onload = "setinterval ('countdown () ', 1000)">
<Center>
Wenge Network Technology Learning Network
<H2> http://www.hubert.idv.tw/</H2>
Automatically takes you to <br>
<Font id = "num" size = "7" face = "impact"> 5 </font>
Example 4:
<A href = "#" onclick = "this. style. behavior = 'url (# default # homepage) '; this. setHomePage ('HTTP: // www.hubert.idv.tw /'); "> <font color =" red "> <u> set to homepage </u> </font> </a> <p>
<A href = "javascript: window. external. addFavorite ('HTTP: // www.hubert.idv.tw/', 'angkor Network Technology Learning net'); "> <font color =" red "> <u> Add to favorites </u> </font> </a> Object:
The current HTML object is composed of <body> tag groups. A file object is automatically created for each HTML file.
Format:
Document. Attributes
Document. Method (parameter) File object attributes:
Linkcolor: sets the hyperlink color.
The color of the hyperlink in the action of alinkcolor
The hyperlink color of the vlinkcolor link.
Links uses array index values to indicate all hyperlinks.
URL
Anchors uses array index values to indicate all anchors.
Bgcolor background color
Fgcolor foreground color
Class attribute in the classes File
Cookie setting cookie
Domain specifies the Domain Name of the server
Formname indicates all forms by form name
Forms uses array index values to represent all forms
Images uses array index values to represent all images
Layers indicates all layers by array index value
Plug-in the embeds File
Applets uses array index values to indicate all applets
Plugins uses array index values to indicate all plug-ins
Referrer indicates the URL of the webpage where the file is currently opened.
Tags indicates the HTML Tag Style
Title the title of this document
Width: the width (PX) of the file)
Lastmodified file last modification time
File object method:
Captureevents (event) settings to get the specified event
Close () closes the Output Response stream and forcibly displays the data content.
Getselection () gets the selected string
Handleevent makes the event processor take effect
Open ([mimetype, [Replace ])
Releaseevents (Event Type) Release acquired events
Routeevent transfers captured events
Write (string) Writing string or value to the file
Writeln (string) Branch writing string or value to the file (<PRE>... </PRE>)
File object event handler:
Onclick ondbclick onkeydown onkeypress onkeyup onmousedown onmouseover
Example 1:
<SCRIPT>
Document. bgcolor = "white ";
Document. fgcolor = "black ";
Document. linkcolor = "red ";
Document. alinkcolor = "blue ";
Document. vlinkcolor = "Purple ";
</SCRIPT>
Color Attribute of the test file object: <br>
<A href = "http://www.hubert.idv.tw"> Wenge Network Technology Learning Network </a>
Example 2:
<SCRIPT>
VaR update_date = Document. lastmodified;
VaR formated_date = update_date.substring (0, 10 );
Document. Write ("date updated on this page:" + update_date + "<br> ")
Document. Write ("date updated on this page:" + formated_date)
</SCRIPT> |
