_javascript techniques for Dom detailed in JavaScript

In order to achieve smooth degradation, backward compatibility, the idea of separation of marks, the first thing to do each time you write JS code should be the necessary testing and inspection work:
In the JS file first add the following code to check:

Window.onload = function () {
if (!document.getelementsbytagname) return  false;
if (!document.getelementbyid) return false;
if (!document.getelementsbyclassname) return  false;
if (!document.getelementbyid ("selector")) return  false;
if (!document.getelementsbytagname ("tag")) return  false;
if (!document.getelementsbyclassname ("selector")) return  false;

General encapsulation Functions:

var $ = function (ID) {return
   Document.getelementby ID (ID);
}
var addevent = function (OBJ,EVENT,FN) {  //obj: Element Object Name, Event: Binding event, fn: triggered callback function
   if (obj.addeventlistener) {
Obj.addeventlistener (Event,fn,false);
   }
   else if (obj.attachevent) {
obj.attachevent ("on" +EVENT,FN);
   }

For many functions that require page loading to run, the Window.onload encapsulation method is as follows:

function Addloadevent (func) {
var oldonload = window.onload;
if (typeof window.onload!= "function")
{
window.onload = func;
}
else
{
window.onload = function ()
{
oldonload ();
Func ();
}} Addloadevent (firstfunction);
Addloadevent (secondfunction);

JavaScript differences between Firefox and IE :

1. In most cases, return false for the event handler to prevent the default event behavior. For example, by clicking a element by default, the page jumps to the page specified by the href attribute of the element.
Return false is the equivalent of a terminator, and return True is the equivalent of an operator.
The summary of the three scenarios for return usage in JS is as follows:
Retrun true; Returns the correct handling of punishment results.
return false; Returns the wrong handling of the punishment, the termination of the punishment, the blocking of the submission form, and the execution of the default action.
Return the control to the page.

2, in most of the time, it would be a good idea to assign a function call to a variable.

3. NoScript tags can be used in browsers that recognize script tags but cannot support scripts. If the browser supports scripting, it does not display the text in the NoScript label.

4, in the dynamic setting style, as long as possible, the best choice of CSS, the simplest is to choose the easiest way to achieve.

5. In a function, global objects are stored as local variables to reduce global lookups because accessing local variables is faster than accessing global variables.

6, if for the running code, should not use settimeout, but should be used setinterval, because settimeout each time will initialize a timer, and SetInterval will only initialize a timer at the beginning.

7, if you want to connect more than one string, you should use + +, conditional branch as far as possible using the three-mesh operator to replace the conditional branch.

8, a lot of people like to use parseint (), in fact, parseint () is used to convert strings into numbers, rather than floating point numbers and integer conversion between, we should use Math.floor () or Math.Round ().

9. All variables in JavaScript can be declared using a single VAR statement, which is a combination of statements to reduce the execution time of the entire script.

10. For large DOM changes, using innerHTML is much faster than creating the same DOM structure using a standard DOM method.

11. When the same object uses a. OnClick method to trigger multiple methods, the latter overrides the previous method, that is, when the object's OnClick event occurs, only the last bound method is executed. With event monitoring there will be no overlay, and each bound event will be executed.

12. If you define the ToString () method for type conversion, it is recommended that you explicitly call ToString (), because the internal operation attempts to convert the object's ToString () method to string after attempting all possibilities. So it is more efficient to call this method directly.

13, because Elemet.style can only get inline style, and element.currentStyle.width is the exclusive property of IE browser, getcomputedstyle (element, NULL). Width is a unique property of Firefox and Chrome browsers, so for compatibility, get the inside and outside style method (not a composite style, such as Background,border, but should be written as Backgroundcolor,borderwidth):

function GetStyle (obj,name) {
   if (obj.currentstyle) {return
     obj.currentstyle[name];
   }
   else
   {return
     getComputedStyle (obj,null) [name];
   }
}

The above mentioned is the entire content of this article, I hope you can enjoy.