// 设置文本
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;
}
}