JavaScript in the JavaScript authoritative guide Web browser

Source: Internet
Author: User
Tags event listener

JavaScript in the URL

The URL followed by a javascript: protocol qualifier, is a way to embed JavaScript code into the client. This particular protocol type specifies that the URL content is any string, which is the JavaScript code that will be run by the JavaScript parser. It is treated as a separate line of code, and the statements must be separated by semicolons, annotated with/**/. The "resource" that Javascript:url recognizes is the return value of the execution code that is converted to a string. If the code returns undefined, then the resource is not content.

You can:<a> the href property of the,<form> in any place using the regular URL, and the parameters of the window's open () method

The Firefox browser executes the URL code and uses the returned string as the content of the new document to be displayed, just like clicking on a Http:url link, and the browser will erase the current document and display the new document. If the return value contains an HTML tag, the browser renders as if rendering an equivalent HTML document that is normally loaded.

Other browsers do not allow URLs to overwrite the current document, ignoring the return value of the code.

If you want to make sure that Javascript:url does not overwrite the current document, you can use the void operator to force a function call or assign a value undefined to an expression.

<a href= "javascript:void window.open (' About:blank ');" > Open Empty Window </a>

If there is no void operator in this URL, the value returned by the call to the window.open () method will be converted to a string and displayed in some theory, and the current document will be overwritten with the document containing the string. [Object Window]

Bookmark

Bookmarks are a saved URL, if the bookmark is Javascript:url, then the save is a small piece of script, called Bookmarklet. As long as the bookmark does not return a value, you can manipulate any document currently displayed without replacing the document with new content.

The single quotation mark of the code is part of the HTML attribute, and the code cannot contain single quotes

<ahref= ' javascript:var e= ""; R= "";/* expressions and results that need to be evaluated */do {/* output expressions and results, and require a new expression */E= Prompt ("Expression:"+ e +" \ n "+ R +" \ n ", e); try {r= "Result:"+ eval (e);} /* Try to calculate the expression */catch (ex) {R= ex;}/* Otherwise remember this error */} while (e)/* know no input or click cancel button to terminate */void 0; /* Prevent the current document from being overwritten */'>JavaScript</a>

Bookmarklet's javascript:url exist outside of the document and can be imagined as a user extension or as a modification to other programs. When the user executes a bookmarklet, the JavaScript code in the bookmark can access the contents of the global object and the current document, manipulating them

The execution phase of javascript: First, load the contents of the document and execute the code in the <script> element (including inline scripts and external scripts). Scripts are usually executed in the order in which they are in the document.

When the document is loaded and completed, all scripts are executed and entered the second phase. This phase is asynchronous and event-driven. During the event-driven phase, the Web browser invokes an event handler function to respond to an asynchronous occurrence. Usually it responds to user input and can be triggered by errors in network activity, run time, or JavaScript code, and Javascript:url embedded in a Web page can also be considered an event handler.

The first thing that happens in the event-driven phase is the Load event, which indicates that the document has been fully loaded and can be manipulated. Once the document is loaded, the event-driven phase continues as long as the Web browser displays the document. Because this phase is asynchronous and event-driven.

synchronous, asynchronous, and deferred scripts

The execution of the script is only synchronized and blocked by default. <script> can have defer and async attributes, which can change how the script executes. is a Boolean property and has no value. The Defer property causes the browser to defer script execution until the document is loaded and parsed, and can be manipulated. The Async property allows the browser to execute scripts as soon as possible without blocking document parsing while downloading scripts. If you have two properties at the same time, support both the async

Deferred scripts are executed in the order in which they appear in the document, and asynchronous scripts execute after they are loaded and may be unordered.

Event-driven

If you need to register multiple event handler functions for an event, or if you want to write a code module that can safely register an event handler, you need to use another event handler registration technique even if another module has registered a program for the same event with the same target.

Window.addeventlistener ("Load", function () {}, False);

In IE8 and before the browser needs to use attachevent ();

    //register function f, call F when document loading is complete    //if the document is already loaded, execute it asynchronously    functionOnLoad (f) {if(onload.loaded) {//if the document is already loaded completeWindow.settimeout (f, 0);//put F into an asynchronous queue and execute as soon as possible            Else if(Window.addeventlistener) Window.addeventlistener ("Load", F,false); Else if(window.attachevent) window.attachevent ("Load", F); }    }    //set the flag for onloadonload.loaded =false;

JavaScript conditional comments for IE

Start with text/* @cc_on and End With text @*/

IE6 can be used in
/*@cc_on @if (@_jscript) // The code is inside a JS comment but executes alert ("in IE") in IE; @end @* /

What JavaScript can't do

Some features are not supported

Client-side JavaScript does not have permissions to write or delete arbitrary files on client computers or to list any directory.

Client-side JavaScript does not have any common network capabilities. Client-side JavaScript programs can program the HTTP protocol, and HTML5 has an accessorial standard called WebSockets, which defines a class socket API for communicating with the specified server. However, these APIs do not allow direct access to a wider range of networks. Common Internet clients and servers cannot use client-side JavaScript to write at the same time.

Limitations on supported Features

The JavaScript program can close its own open browser window, but does not allow other windows to be closed without the user's determination

The Value property of the HTML fileupload element is read-only, and if this property can be set, the foot instinct sets it to any file name, causing the form to upload the contents of the specified file to the server.

The script cannot read the contents of a document loaded from a different server, unless this is the document containing the script. Similarly, a script cannot register an event listener on a document from a different server. This prevents the script from stealing user input from other pages.

Homologous policy

is a complete security restriction on what Web content JavaScript code can manipulate. It usually works when a Web page uses more than one <iframe> or opens another browser window. The same-origin policy is responsible for managing JavaScript code for Windows or forms, and for interacting with other windows or frames. Specifically, the script can read only the window and document properties that belong to the same source as the document .

The following documents are from different sources

from different Web servers

Different ports for the same host

Using http: protocol and using HTTPS protocol

The origin of the script itself is not related to the same Origin policy, which is related to the source of the document that the script embeds.

Non-strict homologous strategy

The domain property of the Document object. The default domain holds the host name of the server on which the document is loaded. The string must have a valid domain prefix or it itself. Domain value must have a number

Cross-domain resource sharing. Extend HTTP with Origin: The request header and the Access-control-allow-origin response header. It allows the server to list sources with header information, or to match all sources with wildcards and to allow files to be requested by any address.

Cross-Document information. Allows a script from one document to pass a text message to a script in another document.

Cross-domain scripting

An attacker injects an HTML expression or script to the target site.

JavaScript in the JavaScript authoritative guide Web browser

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

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.