Summary of JavaScript usage: From BOM and DOM

JavaScript is nothing to get started with. It is mainly used to beautify pages. However, with the deeper understanding of Web development, especially the increasing access to development under Web 2.0, javaScript is actually a very useful language. The following describes how to use JavaScript.

Let's start with BOM and DOM.

How to use JavaScript: BOM and DOM

Since netscape navigator2.0 introduced js into the browser, js has become a different link with the browser, and js execution speed in the browser, it is also one of the main indicators that a variety of browsers are currently displaying. So what is BOM and DOM?

BOM: Browser Object Model is a set of Browser-related features. Due to Browser-related features, there must be no unified standards. The reason is that there is ms ......, fortunately, there are still some factual standards.

DOM: Document Object Model, which is a standard, developed by the famous w3c. Currently, the highest level is level 3, but level 3 has not been completely completed yet, currently, all mainstream browsers can support level 2. For html, that is, html4.x, the highest value is 4.01, later, w3c moved html closer to xml, so it had xhtml1.0. Later, w3c wanted to create xhtml2.0, and the results were slow. In addition, the major manufacturers were not optimistic, as a result, we have html5.0, which is awesome. Please try again ).

If you are interested in the specifications, you can browse an article on the Wiki.

BOM description of JavaScript usage experiences

Now, let's talk about the history of BOM and DOM first. Let's talk about the material stuff. Let's talk about the architecture of BOM:

 

Start with window. For window, the simplest sentence is that it indicates that the browser window that opens the page does not contain the page content. Remember the last sentence. At the very beginning, I used it to access the content of the page. Of course, the result was not accessible.

Since it is a browser window, it must include:

◆ Create window. open ()),

◆ Close window (window. close ()),

◆ Change the window position (resizeBy (), resizeTo ()),

◆ Mobile window moveBy (), moveTo ),

There are also some inherent features, such:

◆ Open a new connection and specify the Opening Method

◆ The system dialog box (alert (), confirm (), prompt () is displayed ()),

◆ SetTimeout (), setInterval ()),

◆ Status bar,

When using the previous operations, you can refer to the documentation. Of course, it is better to remember. However, note that different browsers support different methods. Oh, My God, It's a confusion of world! The last two operations are very unprofessional and should not be used.

The last feature is not professional and should not be used as much as possible. The second and third features will be available at a glance, and nothing to say, the first one is worth mentioning.

Raise a question: how to enable the connection in a new window through js, that is, how to achieve a similar click through js

 
 

  
  
< a href='http://www.sina.com' target='_blank'>sina< /a> 
 
 

Is location used? Yes. Although location has the target attribute, it cannot be used. How can this problem be solved? The answer is to use

 
 

  
  
window.open('http://www.sina.com','_blank'); 
 
 

The actual meaning of this Code is to open a connection in a specified frame.

, _ Top, _ blank. These are proprietary framework names.

Then let's talk about some confusing things, such as parent, self, top, and opener. How can we tell them clearly?

Among them, self is always equal to window, but the name is different, but it is precisely because of this feature that using it can make our code easier to read, and top object and parent object, I think, it is used only in Multi-frame (frames) scenarios. The top object points to the top frame, that is, it is used when frame or iframe is used on a page. Finally, opener is used for window. open () to open a subwindow.

Next, let's talk about the document and location objects. First, I marked these two objects as red in the system diagram of the BOM above. Why? This is simple because of chaos.

Document is an object that belongs to both BOM and DOM, while the location object is an attribute that belongs to both window and document. From the BOM perspective, the document object contains some common attributes and sets in the page, but many attributes in the document (alinkColor, bgColor, fgColor, linkColor, vlinkColor) it can be controlled through css, so I suggest using css as much as possible, while the remaining attributes (lastModifie

D, referrer, title, URL), basically not very useful, to say useful, I think only referrer may be a bit useful, it tells you how the user accesses your page. In fact, document is mainly used for DOM.

The location object indicates the URL of the loading window and can also be used to parse the URL. For example, to obtain the GET request parameters, you can use

 
 

  
  
location.search 
 
 

For history and navigator objects, the history Object provides the go (int), back (), and forward () methods. Their functions are similar to those of the browser, but for security reasons, history only provides the navigation function. To get the user's browsing history, this object alone won't work.

PS: however, it is not impossible to get the user's history. Take advantage of the features of tag.

The navigator object is often used to determine the browser type and operating system type of the user. However, these two problems are also very complicated.

The last one is the screen object. I have never used it in my actual work. Based on the great theory that has no practice and has no right to speak, I will not summarize it.

The above describes how to use JavaScript.

1. C # JavaScript function usage
2. New Features of JavaScript 2.0 come closer to the classic Language
3. Ranking of open-source languages: PHP and JavaScript are favored
4. Development of ASP. NET controls-how to trigger JavaScript scripts using UpdatePanel
5. Use Javascript to implement. NET verification controls