BOM and Dom

Source: Internet
Author: User
Tags mathematical functions

BOM Browser Object Model

Objects in the BOM

Window objects: refers to Windows objects that can be controlled by the properties and methods of a Window object, such as opening or closing a window

History object: Refers to the historical page, through the properties and methods of the old object to realize the function of forward and backward

Location object: Refers to the address bar, through the method of property control page jump

  Document object: Refers to content in a Web page, and controls page elements through properties and methods

1. Window Object Common methods:

Open ();  Close ();  alert ();  Prompt ();  Confim ();  SetTimeout ();  SetTimeout ();  SetInterval (); Clearinterval ();

2. Common methods of History objects:

Window.history.back (); page back;

Window.history.forward (); page forward;

Window.history.go (n); n If a positive number represents the forward n pages, n is a negative number that represents back n pages, which is commonly used.

3, location objects commonly used methods:

var s = window.location.href; Gets the address of the current page

Window.location.href= "http://www.baidu.com"; Change page address, jump page

Window.location.hostname: Host name, domain name, site name, available variable receive

Window.location.pathname: path name, available variable receive

4, document objects commonly used methods: (emphasis)

document.getElementById ("id"); Search by ID, find at most one;

Document.getelementsbyname ("name"), based on name, returns the array

document.getElementsByTagName ("name"); Search by tag name, e.g. <input> Returns an array

Write (); Print content

  4.1. Common operation:

var a =document.getElementById ("id");

alert (a.innertext); take only what's inside

alert (a.outerhtml); includes the contents of the label itself (simple to understand)

Setting content: a.innerhtml = "<font color=red >hello World </font>";

4.2. Operation Properties     

A.setattribute ("attribute name", "attribute value"); Set a property, add or change all can;

A.getattribute ("attribute name"); Gets the value of the property;

A.removeattribute (" attribute name "); Remove an attribute.

4.3. Operation style

document.body.style.backgroundcolor= " color "; the background color of the entire window

A.classname= "ClassName in style sheet "

4.4. Operation of related elements

var a = document.getElementById ("id"); find A;

var B = a.nextsibling, find the next sibling element of a, note the inclusion of spaces;

var B = a.previoussibling, find the previous sibling element of a, note the inclusion of spaces;

var B = A.parentnode, find the upper-level parent element of A;

var B = a.childnodes, find the array, find the next level of a sub-element;

var B = a.firstchild, first child element, LastChild last, Childnodes[n] find a few;

Alert (Nodes[i] instanceof Text); Judging is not the text, is returning true, not returning flase, using if to determine if its value is false, you can remove the space.

4.5. Creation, addition and deletion of elements

var a = document.getElementById ("id"); find A;

var obj = document.createelement ("tag name"); Create an element

obj.innerhtml = "Hello World"; When you add it, you first need to create an element.

A.appendchild (obj); Adds a child element to a.

A.removechild (obj); Delete a child element.

List of A.selectedindex: Selected is the first;

4.6. String manipulation

var s = new String (); or var s = "AAAA";

var s = "Hello World";

Alert (S.tolowercase ()); turn lowercase touppercase () to uppercase

Alert (s.substring (3,8)); Intercept to eighth position from the third position

Alert (S.SUBSTR (3,8)), starting from the third position intercept, intercept eight characters length, do not write the following number is truncated to the last.

S.split ("); Replace the character with the specified character, put in an array, automatically sort

S.length is a property

S.indexof ("World"), where the first occurrence of world in a string is not returned-1

S.lastindexof ("O"); o the last occurrence in the string

4.7. Operation of date and time

var d = new Date (); Current time

D.setfullyear (2015,11,6);/* minus 1 settings on the month you want to set */

D.getfullyear: Take the year;

D.getmonth (): Take the month, take out the less 1;

D.getdate (): Take the day;

D.getday (): Pick up the day of the week

D.gethours (): Take the hour;

D.getminutes (): Take minutes; D.getseconds (): Take seconds

D.setfullyear (): Set the year, note-1 when setting the month.

4.8, the operation of mathematical functions

Math.ceil (); the smallest integer greater than the current decimal

Math.floor (); The largest integer of the current decimal number of a small fish

MATH.SQRT (); open square

Math.Round (); rounding

Math.random (); random number, 0-1



DOM Document Object Model

  The DOM is a tree-based API for XML. Describes the methods and interfaces for handling Web page content, which is the api,dom of HTML and XML to plan the entire page into a node-level document.

  The DOM itself is a language-independent API that is not bound to java,javascript or other languages.

Language-specific Dom

  DOM for XHTML and HTML. This DOM defines a htmldocument and htmlelement as the basis for this implementation. The other Dom that includes SVG

BOM and Dom

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.