#### often encountered about the browser width and height problem:

var winW=document.body.clientWidth||document.docuemntElement.clientWidth; / / page visible area wide var winH = document. The body. The clientHeight | | document. DocuemntElement. ClientHeight; // Wide visible area of web pageCopy the code

// This does not include the width and height of the border, including the border if it is offsetWidth or offsetHeight

var winWW=document.body.scrollWidth||document.docuemntElement.scrollWidth; / / the whole page width var winHH = document. The body. The scrollHeight | | document. DocuemntElement. ScrollHeight; // The height of the entire pageCopy the code
var scrollHeight=document.body.scrollTop||document.docuemntElement.scrollTop; / / web swept to high var scrollLeft = document. The body. The scrollLeft | | document. DocuemntElement. ScrollLeft; // The distance to the left volume of the pageCopy the code
var screenH=window.screen.height; Var screenW=window.screen.width; Var screenX= window.screenleft; // The x coordinate of the browser window relative to the screen (except FireFox) var screenXX= window.screenx; Var screenY= window.screentop; // The y coordinate of the browser window relative to the screen (except FireFox) var screenYY= window.screeny; // The Y coordinate of FireFox relative to the screenCopy the code

####event: document.onclick=function(ev){// var e=ev; console.log(e); } document.onclick=function(){document.onclick=function(){document.onclick=function(){ var e=event; console.log(e); }

Document. onclick=function(ev){ var e=ev||window.event; var mouseX=e.clientX; Var mouseY= e.clienty; // mouse Y coordinates}Copy the code

####DOM node related issues, I directly wrapped the function, so that it can be used at any time:

If (obj. NextElementSibling){return obj. NextElementSibling; } else{ return obj.nextSibling; }; } function prenode (obj) {/ / get the node if one brother (obj. PreviousElementSibling) {return obj. PreviousElementSibling; } else{ return obj.previousSibling; }; If (obj. FirstElementChild){return obj. FirstElementChild; } else{return obj. FirstChild; / / IE678 support}; If (obj. LastElementChild){return obj. LastElementChild; } else{return obj. LastChild; / / IE678 support}; }Copy the code

# # # # document. GetElementsByClassName problem:

/ / the document obtained by the name of the class element. GetElementsByClassName ("); //IE 6 7 8 not supported; // You can define a function to solve the compatibility problem, but don't mention jQuery here... Function byClass1(oClass){function byClass1(oClass){function byClass1(oClass){oClass is the name of the class you want to find, without ". var tags=document.all? document.all:document.getElementsByTagName('*'); var arr=[]; for (var i = 0; i < tags.length; i++) { var reg=new RegExp('\\b'+oClass+'\\b','g'); if (reg.test(tags[i].className)) { arr.push(tags[i]); }; }; return arr; // Return an array containing all the elements of the class you passed in; } function byClass2(parentID,oClass){var parent= document.getelementById (parentID); var tags=parent.all? parent.all:parent.getElementsByTagName('*'); var arr=[]; for (var i = 0; i < tags.length; i++) { var reg=new RegExp('\\b'+oClass+'\\b','g'); if (reg.test(tags[i].className)) { arr.push(tags[i]); }; }; return arr; // Return an array containing all the elements of the class you passed in; }Copy the code

#### element to the edge of the browser:

Function offsetTL(obj){var ofL=0,ofT=0; while(obj){ ofL+=obj.offsetLeft+obj.clientLeft; ofT+=obj.offsetTop+obj.clientTop; obj=obj.offsetParent; } return{left:ofL,top:ofT}; }Copy the code