JS兼容代码及常用代码封装common.js

//格式化日期======↓
// formatDates(dt)

//获取指定的标签对象
// my$(id)
// my$c(cls)

//设置元素的文本内容
// setInnerText(element, text)
// 获取元素的文本内容
// getInnerText(element)

// 获取父级元素中的第一个子元素
// getFirstElement(element)

// 获取父级元素中的最后一个子元素
// getLastElement(element)

// 获取某个元素的前一个兄弟元素
// getPreviousElement(element)

// 获取某个元素的后一个兄弟元素
// getNextElement(element)

// 获取某个元素的所有兄弟元素
// getSiblings(element)

// 返回当前浏览器是什么类型的浏览器
// userBrowser()

// 为任意一个元素绑定事件:元素,事件类型,事件处理函数
// addEventListener(element, type, fn)

// 为任意的一个元素解绑某个事件:元素,事件类型,事件处理函数
// removeEventListener(element, type, fn)

// 获取的是页面向上或者向左卷曲出去的距离的值,返回的是对象
// getScroll()

// 返回不大于指定的字数的新字符串
// cutLongString(string, number)

// ajax原生封装
// ajax({
// url: "", //请求地址
// type: 'GET', //请求方式
// async:true,//同步异步设置
// timeout：6000,//超时设置
// data: {
// name: '',
// age: '',
// email: ''
// }, //请求参数
// success: function(response, xml) {
// console.log(response); // 此处执行请求成功后的回调
// },
// error: function(status) {
// console.log('状态码为' + status); // 此处为请求失败后的回调
// }
// })

//获取指定范围内的随机数
//getRandomNumber(min,max)

//验证表单输入(失去焦点的时候验证)
//checkInput(input,reg)

// 字符串的首尾两端去空格
// 字符串直接调用.trim(),返回值是一个去掉空格后的新字符串

// 累加器函数，reduce方法的回调函数

// 普通比值函数,直接把变量放入sort方法中即可
//升序compareUp，降序compareDown

// 比值函数(排序对象数组，参数传入要进行排序依据的属性名)

// 获取地址栏参数
//getParamString(name)

/**
 * 格式化日期
 * @param dt 日期对象
 * @returns {string} 返回值是格式化的字符串日期
 */
function formatDates(dt) {
    dt = dt || new Date()
    var str = ""//存储时间的字符串
    //获取年
    var year = dt.getFullYear()
    //获取月
    var month = dt.getMonth() + 1
    //获取日
    var day = dt.getDate()
    //获取小时
    var hour = dt.getHours()
    //获取分钟
    var min = dt.getMinutes()
    //获取秒
    var sec = dt.getSeconds()
    month = month < 10 ? "0" + month : month
    day = day < 10 ? "0" + day : day
    hour = hour < 10 ? "0" + hour : hour
    min = min < 10 ? "0" + min : min
    sec = sec < 10 ? "0" + sec : sec
    str = year + "年" + month + "月" + day + "日 " + hour + ":" + min + ":" + sec
    return str
}

/**
 * 获取指定标签对象
 * @param id 标签的id属性值
 * @returns {Element}根据id属性值返回指定标签对象
 */
function my$(id) {
    return document.getElementById(id)
}
function my$c(cls) {
    return document.getElementsByClassName(cls)[0]
}
/**
 * 设置元素的文本内容
 * @param element 任意元素
 * @param text 任意文本内容
 */
function setInnerText(element, text) {
    if (typeof (element.textContent) == "undefined") {
        element.innerText = text
    } else {
        element.textContent = text
    }
}
/**
 * 获取元素的文本内容
 * @param element 任意元素
 * @returns {*} 任意元素中的文本内容
 */
function getInnerText(element) {
    if (typeof (element.textContent) == "undefined") {
        return element.innerText
    } else {
        return element.textContent
    }
}
/**
 * 获取父级元素中的第一个子元素
 * @param element 父级元素
 * @returns {*} 父级元素中的子级元素
 */
function getFirstElement(element) {
    if (element.firstElementChild) {
        return element.firstElementChild
    } else {
        var node = element.firstChild
        while (node && node.nodeType != 1) {
            node = node.nextSibling
        }
        return node
    }
}
/**
 * 获取父级元素中的最后一个子元素
 * @param element 父级元素
 * @returns {*} 最后一个子元素
 */
function getLastElement(element) {
    if (element.lastElementChild) {
        return element.lastElementChild
    } else {
        var node = element.lastChild
        while (node && node.nodeType != 1) {
            node = node.previousSibling
        }
        return node
    }
}
/**
 * 获取某个元素的前一个兄弟元素
 * @param element 某个元素
 * @returns {*} 前一个兄弟元素
 */
function getPreviousElement(element) {
    if (element.previousElementSibling) {
        return element.previousElementSibling
    } else {
        var node = element.previousSibling
        while (node && node.nodeType != 1) {
            node = node.previousSibling
        }
        return node
    }
}
/**
 * 获取某个元素的后一个兄弟元素
 * @param element 某个元素
 * @returns {*} 后一个兄弟元素
 */
function getNextElement(element) {
    if (element.nextElementSibling) {
        return element.nextElementSibling
    } else {
        var node = element.nextSibling
        while (node && node.nodeType != 1) {
            node = node.nextSibling
        }
        return node
    }
}
/**
 * 获取某个元素的所有兄弟元素
 * @param element 某个元素
 * @returns {Array} 兄弟元素
 */
function getSiblings(element) {
    if (!element) return
    var elements = []
    var ele = element.previousSibling
    while (ele) {
        if (ele.nodeType === 1) {
            elements.push(ele)
        }
        ele = ele.previousSibling
    }
    ele = element.nextSibling
    while (ele) {
        if (ele.nodeType === 1) {
            elements.push(ele)

        }
        ele = ele.nextSibling
    }
    return elements
}
/**
 * 返回当前浏览器是什么类型的浏览器
 */
function userBrowser() {
    var broType = ''
    var browserName = navigator.userAgent.toLowerCase()
    if (/msie/i.test(browserName) && !/opera/.test(browserName)) {
        broType = "IE"
    } else if (/firefox/i.test(browserName)) {
        broType = "Firefox"
    } else if (/chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName)) {
        broType = "Chrome"
    } else if (/opera/i.test(browserName)) {
        broType = "Opera"
    } else if (/webkit/i.test(browserName) && !(/chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName))) {
        broType = "Safari"
    } else {
        broType = "Unknown"
    }
    return broType
}



//为任意一个元素绑定事件:元素,事件类型,事件处理函数
function addEventListener(element, type, fn) {
    if (element.addEventListener) {
        //支持
        element.addEventListener(type, fn, false)
    } else if (element.attachEvent) {
        element.attachEvent("on" + type, fn)
    } else {
        element["on" + type] = fn
    }
}
//为任意的一个元素解绑某个事件:元素,事件类型,事件处理函数
function removeEventListener(element, type, fn) {
    if (element.removeEventListener) {
        element.removeEventListener(type, fn, false)
    } else if (element.detachEvent) {
        element.detachEvent("on" + type, fn)
    } else {
        element["on" + type] = null
    }
}

/**
 * 获取的是页面向上或者向左卷曲出去的距离的值,返回的是对象
 * @returns {{top: (Number|number), left: (Number|number)}}
 */
function getScroll() {
    return {
        top: window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop || 0,
        left: window.pageXOffset || document.body.scrollLeft || document.documentElement.scrollLeft || 0
    }
}

// 将需要限制字数的字符串传入
// 方法需要传两个参数，第一个参数是需要传入的字符串，第二个参数是需要保留的字符串字数
function cutLongString(string, number) {
    var newString = ''
    if (string.length > number) {
        return newString = string.sunstring(0, number) + '...'
    } else {
        return newString
    }
}

function ajax(options) {
    options = options || {};
    options.type = (options.type || "GET").toUpperCase();
    options.dataType = options.dataType || 'json';
    options.async = options.async || true;
    options.timeout = options.timeout || 5000;//超时处理，默认5s
    var params = getParams(options.data);
    var timeoutFlag = null;
    var xhr;
    var that = this;
    if (window.XMLHttpRequest) {
        xhr = new XMLHttpRequest();
    } else {
        xhr = new ActiveXObject('Microsoft.XMLHTTP')
    }
    xhr.onreadystatechange = function () {
        if (options.dataType === 'json') {
            if (xhr.readyState == 4) {
                window.clearTimeout(that.timeoutFlag);
                var status = xhr.status;
                if (status >= 200 && status < 300) {
                    // 如果需要像 html 表单那样 POST 数据，请使用 setRequestHeader() 来添加 http 头。
                    options.success && options.success(xhr.responseText, xhr.responseXML);
                } else {
                    options.error && options.error(status);
                }
            }
        } else {
            if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
                window.clearTimeout(that.timeoutFlag);
                var oScript = document.createElement('script');
                document.body.appendChild(oScript);
                var callbackname = 'ajaxCallBack'
                oScript.src = options.url + "?" + params + '&callback=' + callbackname;
                window['ajaxCallBack'] = function (data) {
                    options.success(data);
                    document.body.removeChild(oScript);
                };
            }
        }
    };
    if (options.type == 'GET') {
        xhr.open("GET", options.url + '?' + params, options.async);
        xhr.send(null)
    } else if (options.type == 'POST') {
        xhr.open('POST', options.url, options.async);
        if (options.contentType == "undefined" || options.contentType == null) {
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            xhr.send(params);
        } else {
            xhr.setRequestHeader('Content-Type', options.contentType);
            xhr.send(JSON.stringify(options.data));
        }
    }
    this.timeoutFlag = window.setTimeout(function () {//计时器，超时后处理
        window.clearTimeout(that.timeoutFlag);
        //options.error("timeout");
        xhr.abort();
    }.bind(this), options.timeout);
}
function getParams(data) {
    var arr = [];
    for (var param in data) {
        arr.push(encodeURIComponent(param) + '=' + encodeURIComponent(data[param]));
    }
    return arr.join('&');
}

//获取指定范围内的随机数
function getRandomNumber(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
}

//验证表单输入
  function checkInput(input,reg) {
    //文本框注册失去焦点的事件
    input.onblur=function () {
      if(reg.test(this.value)){
        this.nextElementSibling.innerText="正确了";
        this.nextElementSibling.style.color="green";
      }else{
        this.nextElementSibling.innerText="输入格式错误，请重新输入";
        this.nextElementSibling.style.color="red";
      }
    };
  }

// 字符串的首尾两端去空格
String.prototype.trim = function () { return this.replace(/^\s+|\s+$/g, ""); };

// 累加器函数，reduce方法的回调函数
function summarize(accumulator, number) {
    return accumulator + number;
}

// 普通比值函数,直接把变量放入sort方法中即可
var compareUp = function (a, b) {//升序比值函数
    if (a < b) {
        return -1;
    } else if (a > b) {
        return 1;
    } else {
        return 0;
    }
}
var compareDown = function (a, b) {//降序比值函数
    if (a < b) {
        return 1;
    } else if (a > b) {
        return -1;
    } else {
        return 0;
    }
}

// 比值函数(排序对象数组，参数传入要进行排序的属性名)
var compareObjArr = function (prop) {
    return function (obj1, obj2) {
        var val1 = obj1[prop];
        var val2 = obj2[prop];
        if (!isNaN(Number(val1)) && !isNaN(Number(val2))) {
            val1 = Number(val1);
            val2 = Number(val2);
        }
        if (val1 < val2) {
            return -1;
        } else if (val1 > val2) {
            return 1;
        } else {
            return 0;
        }
    }
}

// 获取地址栏参数
function getParamString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); // 构造一个含有目标参数的正则表达式对象
    var r = window.location.search.substr(1).match(reg);  // 匹配目标参数
    if (r != null) return unescape(r[2]); return null; // 返回参数值
}