nimble-ui/src/Components/layout/scroll/basement/utils/genDom.js

基础vue ui库

import { callFn } from 'nimble-lib';
let _cacheElem = {};

/**
 * 创建dom元素
 * @param {String} tag 创建的dom元素的tagName
 * @param {Object} options 可选参数
 * @param {Object} options.attrs 属性
 * @param {Object} options.styles 样式
 * @returns {HTMLElement} 返回创建的dom节点
 */
export default function genDom (tag, options) {
    tag = tag || 'div';
    let _dom = _cacheElem[tag] = _cacheElem[tag] || document.createElement(tag);
    _dom = _dom.cloneNode();

    const _opts = options || {};
    _each(_opts.attrs, (key, val) => {
        _dom.setAttribute(key, val || '');
    });
    _each(_opts.styles, (key, val) => {
        _dom.style[key] = val;
    });
    return _dom;

    /**
     * 遍历集合
     * @param {Object|Array} list 集合
     * @param {Function} cb 回调方法
     */
    function _each (list, cb) {
        if (list) {
            for (let key in list) {
                if (list.hasOwnProperty(key)) {
                    callFn(cb, [key, list[key]], null);
                }
            }
        }
    }
}