Post a common Javascript code in Mozilla _ basic knowledge

Source: Internet
Author: User
Paste a unique reader (defineGetter and defineSetter) that is commonly used by Mozilla in Javascript code, and add prototype to Element and Event, the method used in IE can also be used in Mozilla. Below we will post some common code
For example
Obj. insertAdjacentHTML, currentStyle, obj. attachEvent, obj. detachEvent, and so on.

Copyright: Erik Arvidsson, webfx

The Code is as follows:

If (Browser. isMozilla) {// set up ie environment for Moz



ExtendEventObject ();
EmulateAttachEvent ();
EmulateEventHandlers (["click", "dblclick", "mouseover", "mouseout ",
"Mousedown", "mouseup", "mousemove ",
"Keydown", "keypress", "keyup"]);

EmulateCurrentStyle ();
/* EmulateDocumentAll ();
EmulateElement ()
*/

// It is better to use a constant for event. button
Event. LEFT = 0;
Event. MIDDLE = 1;
Event. RIGHT = 2;
}
Else {
Event = {};
// IE is returning wrong button number
Event. LEFT = 1;
Event. MIDDLE = 4;
Event. RIGHT = 2;
}

/*
* Extends the event object with srcElement, cancelBubble, returnValue,
* FromElement and toElement
*/
Function extendEventObject (){
Event. prototype. _ defineSetter _ ("returnValue", function (B ){
If (! B) this. preventDefault ();
Return B;
});

Event. prototype. _ defineSetter _ ("cancelBubble", function (B ){
If (B) this. stopPropagation ();
Return B;
});

Event. prototype. _ defineGetter _ ("srcElement", function (){
Var node = this.tar get;
While (node. nodeType! = 1) node = node. parentNode;
Return node;
});

Event. prototype. _ defineGetter _ ("fromElement", function (){
Var node;
If (this. type = "mouseover ")
Node = this. relatedTarget;
Else if (this. type = "mouseout ")
Node = this.tar get;
If (! Node) return;
While (node. nodeType! = 1) node = node. parentNode;
Return node;
});

Event. prototype. _ defineGetter _ ("toElement", function (){
Var node;
If (this. type = "mouseout ")
Node = this. relatedTarget;
Else if (this. type = "mouseover ")
Node = this.tar get;
If (! Node) return;
While (node. nodeType! = 1) node = node. parentNode;
Return node;
});

Event. prototype. _ defineGetter _ ("offsetX", function (){
Return this. layerX;
});
Event. prototype. _ defineGetter _ ("offsetY", function (){
Return this. layerY;
});
}

/*
* Emulates element. attachEvent as well as detachEvent
*/
Function emulateAttachEvent (){
HTMLDocument. prototype. attachEvent =
HTMLElement. prototype. attachEvent = function (sType, fHandler ){
Var polictypename = sType. replace (/on /,"");
FHandler. _ ieEmuEventHandler = function (e ){
Window. event = e;
Return fHandler ();
};
This. addEventListener (optional typename, fHandler. _ ieEmuEventHandler, false );
};

HTMLDocument. prototype. detachEvent =
HTMLElement. prototype. detachEvent = function (sType, fHandler ){
Var polictypename = sType. replace (/on /,"");
If (typeof fHandler. _ ieEmuEventHandler = "function ")
This. removeEventListener (optional typename, fHandler. _ ieEmuEventHandler, false );
Else
This. removeEventListener (polictypename, fHandler, true );
};
}

/*
* This function binds the event object passed along in
* Event to window. event
*/
Function emulateEventHandlers (eventNames ){
For (var I = 0; I <eventNames. length; I ++ ){
Document. addEventListener (eventNames [I], function (e ){
Window. event = e;
}, True); // using capture
}
}

/*
* Simple emulation of document. all
* This one is far from complete. Be cautious
*/

Function emulateAllModel (){
Var allGetter = function (){
Var a = this. getElementsByTagName ("*");
Var node = this;
A. tags = function (sTagName ){
Return node. getElementsByTagName (sTagName );
};
Return;
};
HTMLDocument. prototype. _ defineGetter _ ("all", allGetter );
HTMLElement. prototype. _ defineGetter _ ("all", allGetter );
}

Function extendElementModel (){
HTMLElement. prototype. _ defineGetter _ ("parentElement", function (){
If (this. parentNode = this. ownerDocument) return null;
Return this. parentNode;
});

HTMLElement. prototype. _ defineGetter _ ("children", function (){
Var tmp = [];
Var j = 0;
Var n;
For (var I = 0; I <this. childNodes. length; I ++ ){
N = this. childNodes [I];
If (n. nodeType = 1 ){
Tmp [j ++] = n;
If (n. name) {// named children
If (! Tmp [n. name])
Tmp [n. name] = [];
Tmp [n. name] [tmp [n. name]. length] = n;
}
If (n. id) // child with id
Tmp [n. id] = n
}
}
Return tmp;
});

HTMLElement. prototype. contains = function (oEl ){
If (oEl = this) return true;
If (oEl = null) return false;
Return this. contains (oEl. parentNode );
};
}

Function emulateCurrentStyle (){
HTMLElement. prototype. _ defineGetter _ ("currentStyle", function (){
Return this. ownerDocument. defaultView. getComputedStyle (this, null );
/*
Var cs = {};
Var el = this;
For (var I = 0; I <properties. length; I ++ ){
Cs. _ defineGetter _ (properties [I], encapsulateObjects (el, properties [I]);
}
Return cs;
*/
});
}

Function emulateHTMLModel (){

// This function is used to generate a html string for the text properties/methods
// It replaces '\ N'" As well as fixes consecutive white spaces
// It also repalaces some special characters
Function convertTextToHTML (s ){
S = s. replace (/\ &/g, "&"). replace (//G, ">"). replace (/\ n/g ,"
");
While (/\ s/. test (s ))
S = s. replace (/\ s /,"");
Return s. replace (/\ s/g ,"");
}

HTMLElement. prototype. insertAdjacentHTML = function (sWhere, sHTML ){
Var df; //: DocumentFragment
Var r = this. ownerDocument. createRange ();

Switch (String (sWhere). toLowerCase ()){
Case "beforebegin ":
R. setStartBefore (this );
Df = r. createContextualFragment (sHTML );
This. parentNode. insertBefore (df, this );
Break;

Case "afterbegin ":
R. selectNodeContents (this );
R. collapse (true );
Df = r. createContextualFragment (sHTML );
This. insertBefore (df, this. firstChild );
Break;

Case "beforeend ":
R. selectNodeContents (this );
R. collapse (false );
Df = r. createContextualFragment (sHTML );
This. appendChild (df );
Break;

Case "afterend ":
R. setStartAfter (this );
Df = r. createContextualFragment (sHTML );
This. parentNode. insertBefore (df, this. nextSibling );
Break;
}
};

HTMLElement. prototype. _ defineSetter _ ("outerHTML", function (sHTML ){
Var r = this. ownerDocument. createRange ();
R. setStartBefore (this );
Var df = r. createContextualFragment (sHTML );
This. parentNode. replaceChild (df, this );

Return sHTML;
});

HTMLElement. prototype. _ defineGetter _ ("canHaveChildren", function (){
Switch (this. tagName ){
Case "AREA ":
Case "BASE ":
Case "BASEFONT ":
Case "COL ":
Case "FRAME ":
Case "HR ":
Case "IMG ":
Case "BR ":
Case "INPUT ":
Case "ISINDEX ":
Case "LINK ":
Case "META ":
Case "PARAM ":
Return false;
}
Return true;
});

HTMLElement. prototype. _ defineGetter _ ("outerHTML", function (){
Var attr, attrs = this. attributes;
Var str = "<" + this. tagName;
For (var I = 0; I <attrs. length; I ++ ){
Attr = attrs [I];
If (attr. specified)
Str + = "" + attr. name + '= "' + attr. value + '"';
}
If (! This. canHaveChildren)
Return str + "> ";

Return str + ">" + this. innerHTML +" ";
});

HTMLElement. prototype. _ defineSetter _ ("innerText", function (sText ){
This. innerHTML = convertTextToHTML (sText );
Return sText;
});

Var tmpGet;
HTMLElement. prototype. _ defineGetter _ ("innerText", tmpGet = function (){
Var r = this. ownerDocument. createRange ();
R. selectNodeContents (this );
Return r. toString ();
});

HTMLElement. prototype. _ defineSetter _ ("outerText", function (sText ){
This. outerHTML = convertTextToHTML (sText );
Return sText;
});
HTMLElement. prototype. _ defineGetter _ ("outerText", tmpGet );

HTMLElement. prototype. insertAdjacentText = function (sWhere, sText ){
This. insertAdjacentHTML (sWhere, convertTextToHTML (sText ));
};
}

Related Article

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.