常用js对dom操作的分装[摘抄记录中....]
兼容IE和其他浏览器冒泡事件的方法
function bubblingFun(e) { if(e.stopPropagation) { e.stopPropagation() //IE阻止冒泡事件的方法 }else{ e.cancelBubble() } }
2.IE和其他浏览器为元素绑定事件的函数
e.addEventListener()是w3c在标准监听函数的方法 ,是W3C所支持的,Chrome、FireFox、Opera、Safari、IE9.0及其以上版本都支持该函数;
但是 在IE8以下将不支持该方法,所以需要e.attachEvent() 该方法进行事件的绑定
function bindingFun(dom,nature,functionName) { // dom =>节点 anture => 事件名称 [例如 单击,双击, 鼠标移入/移除] ,functionName=>函数名称 if(dom.addEventListener) { //优先使用该方法 ,该方法可以反复给同一个元素添加多个事件 dom.addEventListener(nature,functionName) // }else if(dom.attachEvent){ // 当部分浏览器无法使用上个方法的时候 , 则使用该方法 , 该方法只要是IE使用的 dom.attachEvent('on' + nature,function() { functionName.call(dom) }) }else{ dom['on' + nature] = functionName // dom.onclick = function(){} } }
3.兼容ie和其他浏览器为元素移除事件的函数
function removeEvent(dom,type,functionName) { // dom => 节点 ,type : 事件类型 ,functionName =>移除函数名称 if(dom.removeEventListener) { //非IE浏览器采用dom2级事件处理 , 移除事件:removeEventListener dom.removeEventListener(type,functionName,false) }else if(dom.datechEvent){ // IE浏览器使用 datechEvent进行事件移除 dom.datechEvent('on' + type , functionName) }else{//dom0级事件处理 dom['on' + type] = functionName } }
4.兼容获取IE和其他浏览器获取事件本身的对象
function getEvent(event) { return event ? event : window.event }
5.兼容IE和其他浏览器获取事件源头元素(标签) 未测试------------------------------------------------------------------------------
function getEventDom(event) { return event.target || event.srcElement }
6.兼容IE和其他浏览器阻止元素默认事件的方法
function preventDefault(event) {
//阻止默认的事件行为
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
}
7.兼容IE和其他浏览器获取css的方法
function getCssStyle(element,attribute){ if(window.getComputedStyle){ return window.getComputedStyle(element,null)[attribute]; } else{ return element.currentStyle[attribute]; } }
8.兼容多个浏览器获取当前滚动的位置
window.getScrollOffset = function() { if (window.pageXOffset) { console.log( { x: document.body.scrollLeft + document.documentElement.scrollLeft, y: document.body.scrollTop + document.documentElement.scrollTop, }) return { x: window.pageXOffset, y: window.pageYOffset, } } else { console.log( { x: document.body.scrollLeft + document.documentElement.scrollLeft, y: document.body.scrollTop + document.documentElement.scrollTop, }) return { x: document.body.scrollLeft + document.documentElement.scrollLeft, y: document.body.scrollTop + document.documentElement.scrollTop, } } }
9.兼容所有的浏览器,清除字符串前后的空格
function trim(str) { if (str & typeof str === "string") { return str.replace(/(^s*)|(s*)$/g,""); //去除前后空白符 } }
[18 ]-----------------------------------------