dom基本操作/事件/脚本化css

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_37504436/article/details/87780652

/*
 * 根据insertBefore(),封装insertAfter()
 */
Element.prototype.insertAfter = function(targetNode, afterNode) {
	var beforeNode = afterNode.nextElementSibling;
	if(beforeNode == null) {
		this.appendChild(targetNode;)
	} else {
		this.insertBefore(targetNode, beforeNode);
	}
}

/*
 * 获取文档视口
 */

function getViewportOffset() {
	if(window.innerWidth) {
		return {
			w: window.innerWidth,
			h: window.innerHeight
		}
	} else {
		if(document.compatMode === "backCompat") {
			return {
				w: document.body.clientWidth,
				h: document.body.clientHeight
			}
		} else {
			return {
				w: document.documentElement.clientWidth,
				h: document.documentElement.clientHeight
			}
		}
	}
}

/*
 * 获取滚动条的距离
 */
function getScrollOffset(){
	if(window.pageXOffset){
		return {
			x: window.pageXOffset,
			y: window.pageYOffset
		}
	}else{
		return {
			x: document.body.scrollLeft + document.documentElement.scrollLeft,
			y: document.body.scrollTop + document.documentElement.scrollTop
		}
	}
}

/*
 * 获取样式
 */
function getStyle(elem, prop){
	if(window.getComputedStyle){
		return window.getComputedStyle(elem, null);
	}else{
		return elem.currentStyle[prop]
	}
}

 事件

//局部阻止右键菜单
box.oncontextmenu=function(){
    return false;
}
 
 
//鼠标左右键
box.onmousedown=function(){
    var event=e.target;
    if(e.which==1){
        leftClick(event);
    }else if(e,which==3){
        rightClick(event);
    }
}

 脚本化css

查看计算样式

window.getComputedStyle(ele, null)  //null  --->获取伪元素