Java scrapt (i)

Javascript

is a powerful programming language on the web for developing interactive Web pages. It does not compile in the preamble, but is directly hacked into the HTML page, with the browser executing

Function: Use JS to add page animation effect, provide user experience, the main applications are: Embedding dynamic text in HTML pages, responding to browser events, reading and writing HTML elements, validating submission data, detecting visitor's browsing information, etc.

JS Local is actually used to add interactive behavior to HTML pages

JS is a scripting language (scripting language is a lightweight programming language)

JS consists of several lines of executable computer code

JS is usually embedded directly into the HTML page

JS an explanatory language (that is, code execution is not precompiled)

The composition of JS:

Core (ECMAScript): syntax, statement

Document Object Model (DOM) Browser object

Browser object Model (BOM) manipulating elements and content in a document

Introduction of JS: Embedded, external chain type

Inline: Embedded with <script> tags <script type = "Text/javascript" >//javascript code </script>

Inline: In an HTML document, introduce a. js file via <scripe src= "" > tags, e.g. <script src = "1.js" type= "Text/javascript" charset= "Utf-8" > </script>

Basic syntax

Variable

Naming specification: Must start with a letter or an underscore, the middle can be a number, a character, or an underscore; A variable cannot contain a symbol such as a space; JS keyword is not used as the variable name; JS is strictly case-sensitive.

Variable declaration: var variable name,//js variable can not be declared, direct use, default value is undefined

Assignment of variables: var variable name = value;//js variable weak type, and the same variable can hold different types of data

Data type

Undefined, a type has only one value, which is undefined. When declaring a variable uninitialized, the default value of the variable is undefined

Null has only one private value null, which represents NULL, a placeholder.

alert (null==undefined);//Output "true", although these two values are equal, they have different meanings.

Boolean, with two values of true and False

Number, which represents any digit

String strings are declared by double or single quotation marks

Calling the TypeOf operator on a variable or value returns one of the following values:

Undefined-If the variable type undefined

Boolean-If the variable is of type Boolean

Number-If the variable is of type number

String-If the variable is of type string

Object-A variable is a reference type or a null type

Basic operation:

The output of the element:

Alert (): Draw a hint box to the page

InnerHTML: Writes a piece of content to an element in the page, overwriting the original object

document.write (): Write content to page

Get element content:

Get element: document.getElementById ("id name");

Gets the value inside the element: document.getElementById ("ID name"). Value

JavaScript events

Common events:

onblur Element loses focus

onchange user changes the contents of a domain

OnClick mouse click on an object

OnDblClick Mouse Double-click an object

OnLoad a page or image is finished loading

OnMouseMove Mouse is moved

onMouseOut mouse away from an element

onMouseOver Mouse is moved to an element

OnSubmit Submit button is clicked

Onfocus/onblur: Focused off-focus event, suitable for form verification.

Onclick/ondblclick: Mouse clicks and double-click events

Onkeydown/onkeypress: Search engines use more

OnLoad: Page Load event, all other operations (anonymous mode) can be put into this binding function. If there is a name, you can write only one in the HTML page.

Onmouseover/onmouseout/onmousemove: Shopping site Product Details page.

OnSubmit: A form submission event with a return value that controls whether the form is submitted.

OnChange: Use this event when the user changes the content (level two linkage)

Form Submission Event: onsubmit

Step Analysis:

One: Determine the event (onsubmit) and bind it to a function

Two: Write this function (get user input data < Get data is need to define a id> in the established location)

Three: The user's data to judge

Four: Data is legal (let the form submit)

Five: illegal data (give error message, do not allow form to submit)

How to control form submission: About event onsubmit: Typically used for form submission, you need to give a return value when defining a function. Onsunmit = return Checkform () in the <sctipt> tag: function checkform () {var uvalue = document.getElementById ("user"). Value;if (uvalue== "") {alert ("User name is empty"); return false;} }

Form Submission Event code optimization

Spotlight Event (Onfocus)

Off-Focus event (onblur)

Step Analysis:

One: Determine the event (onfocus Focus event) and bind it to a function <input type= "text" name= "user" size= "34px" id= "user" onfocus= "showtips ()" Onblur= " Check () "/><span id=" Userspan "></span>>

Two: Write the binding function (give a hint after the input box) in the <sctipt> tab function showtips () {document.getElementById ("Userspan"). innerhtml= "<font color= ' Gray ' > Please enter user name </font>";}

Three: Determine the time (onblur event) and bind it to a function onblur= "check ()" The specific step code is reflected in step one

Four: Write function (check the function, give the hint separately) functioncheck () {var uvalue = document.getElementById ("user"). Value;if (uvalue== "") { document.getElementById ("Userspan"). Innerhtml= "<span color= ' Red ' > Username entered incorrectly </span>";} Else{document.getelementbyid ("Userspan"). innerhtml= "";}}

<span> indicates append

In the pass-through parameter, do not indicate the specific type of the parameter (code below).

<input type= "text" name= "user" size= "34px" id= "user" onfocus= "showtips (' user ', ' username required! ' Onblur= ' Check (' user ', ' username cannot be empty! ') "/><span id=" Userspan "></span>

　　　　　　function Showtips (id,info) {document.getElementById (id+ "span"). innerhtml= "<font color= ' Gray ' >" +info+ "</ Font> ";}

function Check (id,info) {var uvalue = document.getElementById (ID). VALUE;IF (uvalue== "") {document.getElementById (id+ ") Span "). innerhtml=" <font color= ' Red ' > "+info+" </font> ";} Else{document.getelementbyid (id+ "span"). innerhtml= "";}}

Java scrapt (i)