JavaScript (review summary)

Source: Internet
Author: User

一、三个 Common dialog box

1,alert (""): Warning dialog box, the role is to pop up a warning dialog box (most commonly used)

2,confirm (""): Ok dialog box, pop up a dialog with OK and Cancel button--OK return True, Cancel return false, available variable to receive.

3. Primpt ("Text to display"): A dialog box that allows the user to enter content

Second, JavaScript basic syntax

1. Variables

are generic type Var, can store other types of values, can be used directly, not defined. But it's customary to define.

Defining variables: var A; all variable definitions are defined by Var and var is a generic mutable type.

2. Type conversion

It is divided into automatic conversion and casting, which is generally used for casting.

Other types are converted to integers: parseint ();

Other types convert to decimals: parsefloat ();

3. Operators

Math operator : +-*/% + +-;

relational operators : = =! = >= <= > <;

logical operator :&& | | ! ;

Other operators : + = = *=/=%=? :;

4. Statements

It is generally divided into sequential, branching, and cyclic statements.

(1) Spoke statement: if{}else{} if{}else{}

(2) Loop for statement :

5, array (type fixed, length is not fixed)

Definition of the array: new Array (); Its length is dynamically variable and can be placed in any type of element.

Assignment of array elements: a[0]=123;  a[1]= "Hello"; The index in the element starts at 0.

The value of the array: A[i];

Array properties:a.length; The number and length of array elements. No count ()

Methods: A.sort (); Array sorting, sorted by the first character of each element.

A.reverse (); Flips the array.

6. Functions

Four elements of a function: name, input, return value, processing.

Define functions: Function add (formal parameter) {function body} //function named Add, input as parameter, return value can be var type, or return value.

anonymous function: function () {body}

The function must be called to execute. Call to function: Add (argument)

Third, Windows object operations

(a) part

1. ("Open Address", "open position")

2. Window.opener: Open the previous Page object for this page

3, Window.close (): Close the current page

4, window.navigate ("url") jump to the target page (hyperlink), in Google Chrome bug; (not used)

5, Window.moveto (x, y) move the page to a location, the position is determined by x and Y; (not commonly used)

6, Window.resizeto (wide, high) adjust the width and height of the page; (not commonly used)

7, Window.scrollto (x, y) scroll the page to where, y for vertical scrolling; (not commonly used)

(ii) Window.history object

1, Window.history.back (); the page is backwards ;--Mainly remember

2, Window.history.forward (); page forward;

3, 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.

(iii) Window.location object

Location Bar

window.location.href= ""; Modify page address, will jump page (hyperlink)--Main remember (priority to use to do hyperlink)

Iv. Windows Object--window.document objects

It can extract elements from HTML into JS, and then perform various operations on it.

It is the core of JS in the core

(i) Take the element

1, Docunment.getelementbyid ("id"), according to the ID to find, up to find one;

2,docunment.getelementsbyclassname("name") according to ClassName find, find out is an array;

3, Docunment.getelementsbyname ("name"), according to name, find out the array;

4,docunment.getelementsbytagname("name"), according to the name of the tag, find out the array;

Note: It is best to use the ID and classname

(ii) Operation contents

1. Common Elements

value : Alert (a.innerhtml)--all content within the element, including element tags, is taken out

Alert (A.innertext)--takes only the text inside, ignoring all the compiled elements

Assignment :a.innerhtml = "<font color=red >hello World </font>"--if content has elements, it is implemented after compilation

a.innertext--will present the things that are assigned.

2. Change single element

value :var t = Document.f1.t1--form Form ID is F1 with ID T1 input;

var t = document.getElementById ("id")--obtained directly with ID.

Alert (t.value)--Gets the value in input;

Assignment : t.value= "content change";

Note: All form element values are assigned with value

(ii) Operation properties

1. Adding and modifying attributes

Object. SetAttribute ("Property name", "property value")--if no this property is added, the value of this property will be modified instead

2. Get Properties:

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

3. Delete Attributes :

Object. RemoveAttribute ("property name")--Removes a property.

(c) Operation style

1. Add and Modify Styles

object. style. Style name = value
2. Get style

var ... = objects. style. Style name

(iv) operation of relevant elements--writing general purpose special effects

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 that it contains spaces;

var B = a.parentnode--Find the upper-level parent element of A;

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

var B = a.firstchild--First child element, LastChild the last one, Childnodes[n] find a few;

Alert (Nodes[i] instanceof text);--judgment is not text, is return true, not return flase, use if to determine if its value is false, you can remove the space.

Note: Carriage returns and spaces are counted as an element

V. Events

1. onclick: mouse click Trigger

OnDblClick: Double-click Trigger

2, onmouseover: Mouse movement above the trigger

onMouseOut: Triggers when the mouse leaves

3, onblur: trigger when losing focus

Onfocus: Get focus is trigger

4, onkeyup: Trigger when the button is lifted up

Complement: 1, get the current height, width of an element ...--offsetheight, offsetwidth, offset what ...

2. Browser size Change event triggered: window.onresize

JavaScript (review summary)

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

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: and provide relevant evidence. A staff member will contact you within 5 working days.