Javascript Study Notes [8]-Basic BOM application [original] Bank MIS system foreground development Summary (3)-datatable Control Application 2

After playing for several days, I am tired of playing. I beat Dota and CF every day, and I am hacked with my brother. Then I am always killed, I scored 1 point for the initial points of hero 1200. It seems that I am not playing the game. Forget it, forget it. Watch a book and enjoy the new year.

7.1bom source --- window object

Basic knowledge: Bom is (Browser object model-browser object model), because the browser is JavascriptProgramSo the window object and the objects generated by it are called the Host object. They include (document, location, Navigator, event, history, screen, etc ).

If you have readArticleYou will surely remember the effect of a printer. It uses the setinterval () and clearinterval () ---- timer, as well as the setTimeout () and cleartimeout () methods for delayed calling, when using these two pairs of methods, pay attention to estimating the function execution time. If the called function execution time exceeds the interval, it will lead to unpredictable problems.

Basic interactive operations:

1. warning dialog box ---- alert (MSG); -- this is nothing to say, it should always be done.

2. confirmation dialog box ---- confirm (MSG); -- A Message prompt box is displayed. If there is an option, the return value of this method is "true", and the return value of "false" is "no ".

3. Prompt input message dialog box --- prompt (MSG, [input]); -- the return value of this method is an integer or a string, indicating the message you entered. (Rarely used)

4. the enhanced Interactive dialog box --- showmodaldialog (Surl [, varguments]) --- is very powerful. You can refer to the detailed use of showmodaldialog in this article. I personally feel that this method is rarely used, I seem to remember that there is a risk of injection, but I have such an impression that I don't know, right? I am not very useful anyway.

5. my own method: in the [original] Bank MIS system front-end development Summary (3)-datatable Control Application 2 is also useful, in fact, very simple, but relies on the easyui control, there are similar methods for other controls.Code:

 
<Div id = "addrowdialog" Title = "" Closed = 'true' class = "dialog"> <! --//Write the document here--> </Div>
// If you need to use it, use the following section to bring up a dialog box. I personally feel great.
$ ('# Addrowdialog'). Dialog ('open ');
 

Window. Open --- open a new window, window. Close close the current window, and window. Focus gets the focus of the window.

7.2 basic BOM application-manage browsing history, resolve addresses, and obtain browser Information

1. History (historical) object refers to the browser's browsing history. You can use the methods and attributes of this object to customize the forward and backward functions. You can use the following:

Back () -- indicates the back operation. The syntax format is history. Back ([num]). The num parameter is optional. If no parameter exists, a step backward is performed by default.

Forward () -- indicates forward. This method has no parameters.

Go () -- jump to a specific address. The syntax format is history. go ([location]); the parameter location can be an integer or a URL string. A positive value is forward, and a negative value is returned. 0 indicates refreshing the current page and location. reload () is equivalent.

2. Location object -- a very important object. Use console. Log (window. Location); to get the following information:

Next, you can use location. To obtain each attribute and location. XXX () to obtain each method.

3. Use the console. Log (window. Navigator) as the navigator object to view various methods and properties of the class, and then call it as needed. It is generally used to detect browsers.

7.3 Client Data Storage Technology

The Web storage mechanism is a way to securely store and use data through key/value pairs in the form of strings.

1. Local Storage-localstorage: no time limit for data storage.

It is very easy to use. You can obtain and assign values in the form of name-value pairs, as shown in the following code:

 VaROstorage =Window. localstorage; ostorage. Username= "Tonylp ";
 

 

If you use the chorme browser, click F12. under local storage under resources, you can see that the temporary storage key for blog posts in the blog garden is draftbody, the value stored in it is the temporary information of the article, the key is drafttitle, And the blog title is stored in it. (I mean you use a web compiler to post a blog ).

There is also a browser compatibility problem. Earlier versions of Firefox do not implement localstorage, but it provides the globalstorage attribute to create a local storage region for the specified domain. The following code is compatible:

 
VaRStrdomain = "host. yourdomain"//Specify the current domainVaROstorage = Window. localstorage? Window. localstorage: window. globalstorage [strdomain];
 

 

2. Session storage-sessionstorage, which is used for data storage during a session.

Sessionstorage stores data for a session. When the user closes the browser window, the data will be deleted. Similar to localstorage, you can restore valid data when submitting a form error.

3. Storage interface -- HTML 5 specifies that the data types returned by the window. sessionstorage and window. localstorage attributes are both storage

Setitem (Key, value) -- set the key and value values

Getitem (key) -- get value through key

Removeitem (key) -- delete Value

Ostorage. Clear () -- clear all key/value pairs

Ostorage. Key (INDEX) -- get the key value.

3. Web SQL database

(1) Use the window. opendatabase () method of the window object to create and use web SQL database on the webpage.

(2) Execute SQL operations:

1) database. Transaction (callback [, errorcallback [, successcallback]); allow read/write operations

2) database. readtransaction (callback [, errorcallback [, successcallback]); only allow read Operations

The callback parameter defines the callback function to be executed for a transaction operation. All SQL operations executed in this function are transaction operations, either all successful or all failed.

The errorcallback parameter is optional. It defines the callback function to be executed when a transaction operation fails. A parameter is required, and the parameter is a sqlerror object.

The successcallback parameter is optional. It defines the callback function to be executed when a transaction operation is successful. This callback function has no parameter.

(3) execute the SQL statement:

The sqltransaction object defines the executesql () method used to execute SQL operations. Syntax format:

Osqltranscation.exe cutesql (sqlstatement [, arguments [, callback [, errorcallback]);

7.4 New Server Communication Technology

Simply put, let's take a look at the server communication technology. If you need a detailed understanding, go to a special book. A HTML5 Development competition that I and my colleagues attended uses web socket for remote desktop monitoring.

The HTTP protocol is a "Request/response" model. The current communication methods are basically this type. To break the HTTP protocol restrictions, HTML5 standards define server-sent event and web socket, help the server "push" data to the client browser.

1. server push technology uses events for implementation (server-sent event), and the client uses eventsource object for implementation.

Source =NewEventsource (URL); source. onopen=Function(Event) {}; source. onmessage=Function(Event) {}; source. onerror=Function(Event ){};
 

 

2. web socket enables two-way communication between client web applications and server processes.

Socket =NewWebsocket (URL); socket. onopen=Function(Event) {}; socket. onmessage=Function(Event) {}; socket. onerror=Function(Event ){};
 

 

Well, let's just read the book and summarize these things. Next we should start Dom. I read more than half of the books.

All of the above are my hard work and hard work. Please refer to the original link when you reprint it:Http://www.cnblogs.com/tonylp