I haven't used JavaScript For a long time, and I feel a little unfamiliar. Recently I am reading some materials about HTML5 mobile development. I have an intuitive idea that JavaScript was very important yesterday and today, tomorrow will be even more important. Many JavaScript-based frameworks have brought great convenience to our development. But to better use these tools, we must have a higher understanding of JavaScript and open up previous notes, start to review.
I. Functions of JavaScript
1. Data VerificationIi. Composition of JavaScript2. webpage operations (dynamic effects of webpages)
3. Operation window
4. One of the core ajax Technologies
1. ECMAScript specificationsECMAScript specifies the core Syntax of JavaScript scripts, such as data types, keywords, reserved words, operators, objects, and statements. It does not belong to any browser.
ECMAScript standard defines the most core content in JavaScript scripts, which is the "skeleton" of JavaScript scripts. With the "skeleton", you can expand it, for example, DOM (Document Object Model) and BOM (Browser object model ).Shengyang Netscape Communications Company 1996 Netscape Navigator Microsoft 1996 Internet Explorer
DOM defines interfaces for JavaScript operations on HTML documents, and provides methods for accessing HTML documents (such as body, form, div, and textarea) and operation methods.
The html dom does not appear as long as it is not a standard (in various browsers), and the w3c dom does not appear yet (dom 0)
Many browsers also support some objects.
Select
Option
Table
TableRow
TableCellUnfortunately, BOM is only an extension of ECMAScript, and there are no relevant standards. W3C has not standardized this part. Each browser vendor has its own BOM implementation, this is the weakness of BOM.
Generally, browser-specific (that is, not stipulated by W3C standards) JavaScript extensions are considered as part of the BOM, mainly including:
<Input type = "button" onclick = "f1 ()"/>
(2) bind to the dom Node
Var obj = document. getElementById (id );
Obj. onclick = f1; // bind to the dom Node<Html> <! -- Bind the event processing code -->
Separate html code and javascript codeFunction f1 () {alert ('hello');} // window. onload indicates that when all the html documents are parsed, // That is to say, after the entire dom tree is generated, the browser will generate a load event window. onload = function () {var obj = document. getElementById ('b1 '); obj. onclick = f1 ;}; // The load event is not generated by the user. It is generated by the browser. // The following events are used to trigger the event // click blur mouseover submit change
<Html> <! -- Bind the event processing code -->
The advantage of this binding method is that JavaScript code and html code can be separated to facilitate code maintenance.
However, the disadvantage of this method is that it is not convenient to pass parameters. You need to use anonymous functions to pass parameters.
// If You Want To transmit parameters, you can write an anonymous function f1 (info) {alert ('hello' + info);} // window. onload indicates that when all the html documents are parsed, // That is to say, after the entire dom tree is generated, the browser will generate a load event window. onload = function () {var obj = document. getElementById ('b1 '); obj. onclick = function () {// anonymous function f1 ('zs'); // transfer parameter };}; // The load event is not generated by the user, it is a browser-generated // The following events are used to trigger the // click blur mouseover submit change
(3) Use the binding method of each Browser
It is recommended to use less because of browser compatibility issues.
IE: directly use event
Firefox: You need to add the event parameter to the method.
To be compatible with ie, firefox only needs to add the event parameter to the method.<Html> Locate the event source (the object that generates the event)Firefox: event.tar get
<Html>
3. Event bubbling<Html>
How to cancel event bubbling: event. cancelBubble = true;<Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
