js兼容代码

// 设置文本
function setInnerText (ele, text) {
	if (ele.textContent) {

		ele.textContent = text;
	}else {
		ele.innerText = text;
	}
}

// 获取文本
function getInnerText (ele) {
	return ele.textContent?ele.textContent:ele.innerText;
}

// 动画函数
function animate(ele, json, fn) {
	clearInterval(ele.timeId);
	var current,
		target,
		step;
	ele.timeId = setInterval(function(){
		var flag = true;
		for(var attr in json) {
			if(attr == "opacity") {
				// 获取当前该属性的值
				current = EventUtil.getStyle(ele, attr) * 100;
				// 获取想要目标值
				target = json[attr] * 100;
				// 每次行走的步数
				step = (target - current) / 10;
				step = step > 0 ? Math.ceil(step) : Math.floor(step);
				current += step;
				ele.style[attr] = current / 100;
				
			}else if(attr == "zIndex" || attr == "backgroundColor" || attr == "color") {
				ele.style[attr] = json[attr];
			}else {
				// 获取当前该属性的值
				current = parseInt(EventUtil.getStyle(ele, attr));
				// console.log(EventUtil.getStyle(ele, attr))
				// 获取想要目标值
				target = json[attr];
				// 每次行走的步数
				step = (target - current) / 10;
				step = step > 0 ? Math.ceil(step) : Math.floor(step);
				current += step;
				ele.style[attr] = current + "px";
			}
			if(current != target) {
				flag = false;
			}
		}
		if(flag) {
			clearInterval(ele.timeId);
			if(fn) {
				fn();
			}
		}
	},20);
}

// 获取第一个子元素
function getFirstElementChild (ele) {
	if (ele.firstElementChild) {
		return ele.firstElementChild;
	}else {

		var node = ele.firstChild; // IE8获取的是第一个子元素
		// 防止有些浏览器不支持firstElementChild,但支持firstChild,得到的是第一个子节点
		while (node && node.nodeType!=1) { 
			node = node.nextSibling;
		}
		return node;
	}
}

// 获取最后个子元素
function getLastElementChild (ele) {
	if (ele.lastElementChild) {
		return ele.lastElementChild;
	}else {
		var node = ele.lastChild; // IE8获取的是最后一个子元素
		// 防止有些浏览器不支持lastElementChild,但支持lastChild,得到的是最后一个子节点(有可能是文本)
		while (node && node.nodeType!=1) { 
			node = node.previousSibling;
		}
		return node;
	}
}

// 获取前一个兄弟元素
function getPreviousElement (ele) {
	if (ele.previousElementSibling) {
		return ele.previousElementSibling;
	}else {
		return ele.previousSibling; // IE8获取的是上一个兄弟元素
	}
}

// 获取下一个兄弟元素
function getNextElement (ele) {
	if (ele.nextElementSibling) {
		return ele.nextElementSibling;
	}else {
		return ele.nextSibling; // IE8获取的是下一个兄弟元素
	}
}

// 获取所框选的文本
function getSelectionText (ele) {
	if (typeof ele.selectionStart == "number") {
		return ele.value.substring(ele.selectionStart, ele.selectionEnd);
	}else if(document.selection) {
		return document.selection.createRange().text;
	}
}

// 获取文本框中索引到索引之间的文本
function selectText (ele, startIndex, endIndex) {
	if(ele.setSelectionRange) {
		ele.setSelectionRange(startIndex, endIndex);
	}else if (ele.createTextRange) {
		var range = ele.createTextRange();
		range.collapse(true);
		range.moveStart("character", startIndex);
		range.moveEnd("character", endIndex - startIndex);
		range.select();
	}
	ele.focus();
}

// AJAX
function ajax (obj) {
	var str, xhr, timer;
	var arr = [];
	// 判断数据是否是object类型的(json格式)
	if (typeof obj.data === "object") {
		// 如果url固定了,当后台数据改变时,IE浏览器会认为这网页固定了,
		// 数据不会变,所以要在url后加随机数,伪装成“不同网页”
		obj.data.random = Math.random();
		for (let key in obj.data) {
			arr.push(encodeURIComponent(key) + "=" + encodeURIComponent(obj.data[key]));
		}
		str = arr.join("&");
	}
	
	// 创建对象
	if (window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	} else {
		xhr = new ActiveXObject("Microsoft.XMLHTTP");
	}

	// 监听状态
	EventUtil.addEventListener(xhr, "readystatechange",function () {
		if (xhr.readyState != 4) {
			return;
		}else {
			clearInterval(timer);
			// 判断状态码
			if (xhr.status >= 200 && xhr.status <= 300) {
				obj.success(xhr);
			}else {
				obj.error(xhr);
			}
		}
	});

	// 判断请求方式类型,
	// 将请求方式转换成大写
	if (obj.type.toUpperCase() === "GET") {
		// 建立连接
		xhr.open(obj.type, obj.url + "?" + str, true);
		// 发送请求
		xhr.send(null);
	}else if (obj.type.toUpperCase() === "POST") {
		xhr.open(obj.type, obj.url, true);
		xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded");
		xhr.send(str);
	}

	// 判断是否有时间限制
	if (obj.timeout) {
		timer = setInterval (function () {
			// 终止请求
			xhr.abort();
			clearInterval(timer);
		}, obj.timeout);
	}
}

var EventUtil = {
	// 绑定事件
	addEventListener : function (ele, type, fn) {
		if (ele.addEventListener) {
			ele.addEventListener(type, fn, false);
		}else if (ele.attachEvent) {
			ele.attachEvent("on"+type, fn);
		}else {
			ele["on"+type] = fn;
		}
	},

	// 解除绑定
	removeEventListener : function (ele, type, fn) {
		if (ele.removeEventListener) {
			ele.removeEventListener(type, fn, false);
		}else if (ele.detachEvent) {
			ele.detachEvent("on"+type, fn);
		}else {
			ele["on"+type] = null;
		}
	},

	// 获取事件对象
	getEvent : function (event) {
		return event||window.event;
	},

	// 获取目标对象
	getTarget : function (event) {
		return event.target||event.srcElement;
	},

	// 取消默认事件
	preventDefault : function (event) {
		if (event.preventDefault) {
			event.preventDefault();
		}else {
			event.returnValue = false;
		}
	},

	// 阻止冒泡
	stopPropagation : function (event) {
		if (event.stopPropagation) {
			event.stopPropagation();
		}else {
			event.cancelBubble = true;
		}
	},

	// 判断按下了鼠标哪个键(左中右)
	getButton : function (event) {
		if (document.implementation.hasFeature("MouseEvents", "2.0")) {
			return event.button;
		}else {
			// IE8及以下
			switch(event.button) {
				case 0 :
				case 1 :
				case 3 :
				case 5 :
				case 7 :
					return 0;
				case 4 :
					return 1;
				case 2 :
				case 6 :
					return 2;
			}
		}
	},

	// scroll
	getScroll : function () {
		return {
			left :window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0,
			top :window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
		}
	},

	// screen
	getScreen : function () {
		return {
			left : (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX,
			top : (typeof window.screenTop == "number") ? window.screenTop : window.screenY
		}
	},

	// 获取CSS样式
	getStyle : function (ele, attr) {
		return window.getComputedStyle ? window.getComputedStyle(ele, null)[attr] : ele.currentStyle[attr];
	},

	// pageX
	getPageX : function (e) {
		return e.pageX ? e.pageX : e.clientX + this.getScroll().left;
	},

	// pageY
	getPageY : function (e) {
		return e.pageY ? e.pageY : e.clientY + this.getScroll().top;
	}
}

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值