BOM, document width height, and window events

Source: Internet
Author: User
Tags blank page

(i) Bom:browser object model (Browser object models)
All variables on the page are properties of window

First, the method:
1. Open (,)
Open a new Window (page)
One parameter is the page address URL, and the two arguments are open mode
Open a blank page by default if the URL is empty
Opens a new window by default if open with blank mode
Return value: Play the Window object of the newly opened Windows


2. Close (,)
Close the window, the front object is who closes who
compatible: (1) Firefox FF: default cannot be turned off
(2)chorme: Default direct Shutdown
(3)ie: Ask the user
you can close the new window opened in this window via the JS method

Second, the attribute:
1. Window.navigator.userAgent ==> Browser information (can be used for different browsers to take different actions)

2. window.location ==> Browser address information, return object objects
so there are properties under it:
window.location.href Address of ==> address bar
Window.location.search in ==>url? After the content (including? )
Window.location.hash content after # ==>url (including #)

(ii) Width and height of the document
1. document.documentelement.clientwidth[height] ==> Visible area width is high (because the document is not wide, so add documentelement

, where document.documentelement can be replaced with any element with a wide height attribute, the same as below)
Document.documentelement.scrolltop[left] ==> scroll bar scrolling distance (with compatible chrome that the scroll button counts as the body)
compatible Processing:
var scrolltop=document.documentelement.scrolltop| | Document.body.scrollTop;

2. Box elements. scrollheight[width] ==> box content width High

3. document.documentelement.offsetwidth[height] ==> document visibility width High

(iii) window events
onscroll ==> triggered when scroll bar is scrolled
onreset ==> triggered when the window size has changed
Note: The triggering of these two events is calculated by time interval, the change speed is fast, the number of triggers is low, the change speed is slow, the number of triggering events is many
Eg:var i=0;
window.onscroll=function () {
document.title=i++;
}

BOM, document width height, and window events

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.