1. Get a compatible sibling node after writing
var nextElement=oLi3.nextElementSibling||oLi3.nextSibling;
2. Obtain written before a compatible sibling
var previousElement = oLi3.previousElementSibling || oLi3.previousSibling;
3. childNodes compatible use
getChildNodes function (ELE) {
//. 1 define an empty array.
var ARR = [];
. 2 // Get the specified element
var oEle = document.querySelector (ELE);
.. 3 // all lower elements to get sons
for (var I = 0; I <oEle.childNodes.length; I ++) {
// variables determining true son. 4 (element nodes. 1 == nodeType).
IF (oEle.childNodes [I] == .nodeType. 1) {
// add 5 to true son array
arr.push (oEle.childNodes [I])
}
}
// returns an array. 6.
return ARR;
}
4. get first son
var No1 = oBox.firstElementChild || oBox.firstChild;
5. Finally got a son
var oLast = oBox.lastElementChild || oBox.lastChild;
6. Event Audience compatible
var t = event.target || event.srcElement;
Compatible with the wording of the scroll bar
A simple wording compatible
document.documentElement.scrollTop||document.body.scrollTop
Two high-level compatible with the wording
myScroll function () {
// IE9 above, google, Firefox can use
IF (window.pageXOffset = undefined!) {
return {
"left": window.pageXOffset,
"Top": window.pageYOffset
}
} the else IF (Document. == compatMode "CSS1Compat") {
// standard DTD (with a statement head)
return {
"left": document.documentElement.scrollLeft,
"Top": document.documentElement.scrollTop
}
}
// no nonstandard DTD (no head declaration )
return {
"left": document.body.scrollLeft,
"Top": document.body.scrollTop
}
}
The new label html5 have compatibility issues in ie 6 7 8 next address the principle is dynamically created label document.createElement, I can be quick to use plug-html5shiv
Compatible with the wording of the event object
was e = any || window.event;
Keyboard Events
var keyCode = e.keyCode || e.which;
Gets the style of writing compatible
function getStyle(obj, attr) {
// 非ie,google,火狐
if (window.getComputedStyle) {
return window.getComputedStyle(obj, null)[attr];
}
//ie 6 8 9
return obj.currentStyle[attr];
}
Compatible prevent bubbling
if (e.stopPropagation) {
e.stopPropagation();
} else {
e.cancelBubble = true;
}
Prevent the default behavior
if (e.preventDefault) {
e.preventDefault()
} else {
e.returnValue = false;
}
Event Listener compatible wording
oBtn.addEventListener ( "the Click", function () {
Alert ( "the most handsome Luo Feng Changsha one thousand");
}, {
Once: to true, // can only be one point
useCapture: // to true to true || false
})
// obj to the specified element to the event
type (click, mouseenter ..) // type events
// fn function name
// useCapTure capture or bubbling
function addEvent (obj, of the type, the Fn, useCapture) {
IF (obj. the addEventListener) {
obj.addEventListener (type, Fn, useCapture)
} the else {
obj.attachEvent ( "ON" + type, Fn)
}
}
Removing event listeners compatible wording
function removeEvent(obj, type, fn, useCapTure) {
if (obj.removeEventListener) {
obj.removeEventListener(type, fn, useCapTure);
} else {
obj.detachEvent("on" + type, fn);
}
}
