src/common/util/dom.js

/**
 * @file melon dom 相关的小工具
 * @author leon([email protected])
 */

exports.on = function (target, eventName, handler) {
    if (target.addEventListener) {
        target.addEventListener(eventName, handler);
    }
    else {
        target.attachEvent('on' + eventName, handler);
    }
};

exports.off = function (target, eventName, handler) {

    if (target.removeEventListener) {
        target.removeEventListener(eventName, handler);
    }
    else {
        target.detachEvent('on' + eventName, handler);
    }

};

exports.contains = function (container, contained) {
    if (container.contains) {
        return container.contains(contained);
    }
    while ((contained = contained.parentNode)) {
        if (contained === container) {
            return true;
        }
    }
    return false;
};

/**
 * 获取文档的兼容根节点
 *
 * @inner
 * @param {?HTMLElement=} el 节点引用，跨 frame 时需要
 * @return {HTMLElement} 兼容的有效根节点
 */
function getCompatElement(el) {
    var doc = el && el.ownerDocument || document;
    var compatMode = doc.compatMode;
    return !compatMode || compatMode === 'CSS1Compat'
        ? doc.documentElement
        : doc.body;
}

exports.getScrollLeft = function () {
    return window.pageXOffset || getCompatElement().scrollLeft;
};

exports.getScrollTop = function () {
    return window.pageYOffset || getCompatElement().scrollTop;
};

exports.getClientHeight = function () {
    return getCompatElement().clientHeight;
};

exports.getClientWidth = function () {
    return getCompatElement().clientWidth;
};

exports.getPosition = function (element) {

    var bound = element.getBoundingClientRect();

    var root = document.documentElement;
    var body = document.body;

    var clientTop = root.clientTop || body.clientTop || 0;
    var clientLeft = root.clientLeft || body.clientLeft || 0;
    var scrollTop = window.pageYOffset || root.scrollTop;
    var scrollLeft = window.pageXOffset || root.scrollLeft;

    return {
        left: parseFloat(bound.left) + scrollLeft - clientLeft,
        top: parseFloat(bound.top) + scrollTop - clientTop,
        width: bound.width,
        height: bound.height
    };

};

exports.hasClass = function (element, cls) {
    return element.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));
};

exports.addClass = function (element, cls) {
    if (!this.hasClass(element, cls)) {
        element.className += ' ' + cls;
    }
};

exports.removeClass = function (element, cls) {
    if (this.hasClass(element, cls)) {
        var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
        element.className = element.className.replace(reg, ' ');
    }
};