Interactive pathfinding of "JS" JavaScript and BOM

JS BOM

The interaction between JS and Dom has been mentioned before. The BOM (Browser object module) is the object model of the browser, and it can also interact with JS. In other words, JS can also interact with the browser. Because the modern mainstream browser has realized the JS and BOM related methods, so JS to the BOM also has a very high versatility and compatibility. Here are some common objects that each browser has to tell about how JS and BOM interact.

Window object

The Window object abstracts the browser's windows, which is the user's viewport. The abstract Document object for documents commonly used in the DOM is also a property of the Window object: window.document

Property:

Window.innerheight Browser Interior Window height

Window.innerwidth Browser Interior window width

Method:

window.open () open window

Window.close () Close window

Window.moveto (x, y) moves the window to

Window.resizeto (x, y) Change window size

Window.screen Object

Window.screen Object Abstract is the user's screen, in the programming can omit window directly write structure わない.

Property:

Screen.availheight User Screen Height

Screen.availwidth User Screen width

* These two are not the same size as window, such as the browser window is not maximized, or a page with multiple iframe (each is counted as a separate window), the window size will be smaller, but the screen size is unchanged.

Window.location Object

The Window.location object abstracts the URL of the page. Like screen, you don't have to prefix windows when you write.

Property:

Location.href the full URL of the current page

Location.hostname the domain name of the web host

Location.pathname the current page path or file name

Location.port the currently connected port

Location.protocol protocol for current connection

Method:

Location.assign (New_url) to reload a new page in the current window

Window.history Object

The History object maintains the user's historical operation information, as above can save the window prefix

Method:

History.back () equivalent to browser fallback

History.forward () is equivalent to the browser's forward

　　　　

Window.navigator Object

The Navigator object maintains information about the browser in this request, and can also remove the window prefix

Just look at an example:

TXT = "<p>browser codename:" + Navigator.appcodename + "</p>"; txt+ = "<p>browser Name:" + Navi Gator.appname + "</p>"; txt+ = "<p>browser Version:" + navigator.appversion + "</p>"; txt< /c2>+= "<p>cookies Enabled:" + navigator.cookieenabled + "</p>"; txt+ = "<p>platform:" + Navig Ator.platform + "</p>"; txt+ = "<p>user-agent header:" + navigator.useragent + "</p>"; txt + = "<p>user-agent language:" + navigator.systemlanguage + "</p>";d Ocument.getelementbyid (" Example "). Innerhtml=txt;

The resulting results are:

Browser codename:mozillabrowser name:netscapebrowser version:5.0 (Windows) Cookies enabled:trueplatform: Win32user-agent header:mozilla/5.0 (Windows NT 10.0; WOW64; rv:52.0) gecko/20100101 firefox/52.0user-agent language:undefined

　　

Message Box Object

JS calls the message box object most of the time by calling its construction method to jump out of a message box. There are probably several message boxes:

alert (message) Prompt box

Confirm (message) Confirm box, user point OK returns True, Cancel return False

Prompt (message,defaultvalue) Promotion input box, user input after click confirm Return input value, click Cancel Return default value, if default value is not set then return null

Timed objects

JS can call the following two methods to set/Cancel the timing, set the timing is equivalent to the set to let certain actions occur after a fixed time

SetTimeout ("Some_javascript", Milisecond) note two points, 1. The unit of the timing is milliseconds 2. The first parameter is not a function or any other object, but a string. In other words, the string must be passed in, and JS will parse the string and execute it. The SetTimeout method returns a timed object.

The cleartimeout (timeout_object) parameter is a timed object used to cancel the timed task set by this timed object.

To take a comprehensive look at an example, this instance presses the Start Count button and increments one count every second, infinitely loops until the Stop Count button is pressed

<HTML><Head><Scripttype= "Text/javascript">varC=0varTfunctionTimedcount () {document.getElementById ('txt'). Value=C c=C+1T=SetTimeout ("Timedcount ()", +) }functionStopcount () {cleartimeout (t)}</Script></Head><Body><form><inputtype= "button"value= "Start count!"OnClick= "Timedcount ()"><inputtype= "text"ID= "txt"><inputtype= "button"value= "Stop count!"OnClick= "Stopcount ()"></form></Body></HTML>

　　

Interactive pathfinding of "JS" JavaScript and BOM