zarm-web/lib/utils/dom.js

基于 React 的桌面端UI库

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

/* eslint-disable */
var domUtil = {
  // 获取元素的纵坐标（相对于窗口）
  getTop: function getTop(e) {
    var offset = e.offsetTop;

    if (e.offsetParent != null) {
      offset += domUtil.getTop(e.offsetParent);
    }

    return offset;
  },
  // 获取元素的横坐标（相对于窗口）
  getLeft: function getLeft(e) {
    var offset = e.offsetLeft;

    if (e.offsetParent != null) {
      offset += domUtil.getLeft(e.offsetParent);
    }

    return offset;
  },
  probTouch: function probTouch() {
    return 'ontouchend' in document;
  },
  // 获取元素大小以及相对窗口的位置
  getBoundingClientRect: function getBoundingClientRect(e) {
    var rect = e.getBoundingClientRect(); // 解决ie下的兼容问题

    var isIE = navigator.userAgent.indexOf('MSIE') !== -1;
    var rectTop = isIE && e.tagName === 'HTML' ? -e.scrollTop : rect.top;
    return {
      left: rect.left,
      top: rectTop,
      right: rect.right,
      bottom: rect.bottom,
      width: rect.right - rect.left,
      height: rect.bottom - rectTop
    };
  },
  // 设置元素行内样式
  setStyle: function setStyle(e, styles) {
    function is_numeric(n) {
      return n !== '' && !isNaN(parseFloat(n)) && isFinite(n);
    }

    Object.keys(styles).forEach(function (prop) {
      var unit = '';

      if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && is_numeric(styles[prop])) {
        unit = 'px';
      }

      e.style[prop] = styles[prop] + unit;
    });
  },
  // 获取元素css的某一个计算后属性值
  getStyleComputedProperty: function getStyleComputedProperty(e, property) {
    var css = window.getComputedStyle(e, null);
    return css[property];
  },
  // 判断元素是否固定定位或者是否在固定定位元素内
  isFixed: function isFixed(e) {
    if (e === window.document.body) {
      return false;
    }

    if (domUtil.getStyleComputedProperty(e, 'position') === 'fixed') {
      return true;
    }

    return e.parentNode ? domUtil.isFixed(e.parentNode) : e;
  },
  // 获取元素完整尺寸(offset size + margin)
  getOuterSizes: function getOuterSizes(e) {
    var _display = e.style.display;
    var _visibility = e.style.visibility;
    e.style.display = 'block';
    e.style.visibility = 'hidden'; // const calcWidthToForceRepaint = e.offsetWidth;

    var styles = window.getComputedStyle(e);
    var x = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
    var y = parseFloat(styles.marginLeft) + parseFloat(styles.marginRight);
    var result = {
      width: e.offsetWidth + y,
      height: e.offsetHeight + x
    }; // reset

    e.style.display = _display;
    e.style.visibility = _visibility;
    return result;
  },
  // 获取元素的offsetParent
  getOffsetParent: function getOffsetParent(e) {
    var offsetParent = e.offsetParent;
    return offsetParent === window.document.body || !offsetParent ? window.document.documentElement : offsetParent;
  },
  // 获取指定元素可滚动的父元素
  getScrollParent: function getScrollParent(e) {
    var parent = e.parentNode;

    if (!parent) {
      return e;
    }

    if (parent === window.document) {
      if (window.document.body.scrollTop) {
        return window.document.body;
      }

      return window.document.documentElement;
    }

    if (['scroll', 'auto'].indexOf(domUtil.getStyleComputedProperty(parent, 'overflow')) !== -1 || ['scroll', 'auto'].indexOf(domUtil.getStyleComputedProperty(parent, 'overflow-x')) !== -1 || ['scroll', 'auto'].indexOf(domUtil.getStyleComputedProperty(parent, 'overflow-y')) !== -1) {
      return parent;
    }

    return domUtil.getScrollParent(e.parentNode);
  },
  // 获取浏览器支持的带前缀属性名
  getSupportedPropertyName: function getSupportedPropertyName(property) {
    var prefixes = ['', 'ms', 'webkit', 'moz', 'o'];

    for (var i = 0; i < prefixes.length; i++) {
      var toCheck = prefixes[i] ? prefixes[i] + property.charAt(0).toUpperCase() + property.slice(1) : property;

      if (typeof window.document.body.style[toCheck] !== 'undefined') {
        return toCheck;
      }
    }

    return null;
  },
  // 获取元素scrollTop
  getScrollTopValue: function getScrollTopValue(e) {
    return e === document.body ? Math.max(document.documentElement.scrollTop, document.body.scrollTop) : e.scrollTop;
  },
  getScrollLeftValue: function getScrollLeftValue(e) {
    return e === document.body ? Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) : e.scrollLeft;
  }
};
var _default = domUtil;
exports.default = _default;