domTools

dom操作方法

方法

方法名	方法	说明
js_utils_css	`(dom:HTMLElement, key: string	CSSStyleDeclaration, value:string) => void`
js_utils_dom_offset	(dom: Element & HTMLElement) => { left: number, top: number}	计算当前元素距离body的偏移量
js_utils_dom_has_class	(el: Element, cls: string) => boolean	是否有此class
js_utils_dom_add_class	(el: Element, cls: string) => void	添加class
js_utils_dom_remove_class	(el: Element, cls: string) => void	删除class
on	`(element: Element	HTMLElement
off	`(element: Element	HTMLElement
js_utils_copy_code	(text: string)=>void	字符串复制到剪切板

使用方法

前提import { xxx } from '@/assets/ts/domTools'

css

js_utils_css(dom, 'background', '#FFF') 或者
js_utils_css(dom, {
  background: '#FFF',
  color: '#000' 
})

offset

/**
 * return {top: 10, left: 10}
*/
js_utils_dom_offset(dom)

hasClass

/**
 * return true ? false
*/
js_utils_dom_has_class(dom, 'container')

addClass

/**
 * <div class="container flex w-100">
*/
js_utils_dom_add_class(dom, 'container, flex, w-100')

removeClass

/**
 * <div class="">
*/
js_utils_dom_remove_class(dom, 'container, flex, w-100')

on

/**
 * 添加事件
*/
const event = (e) => {
  console.log(e)
}
on(dom, 'click', event)

off

/**
 * 删除事件
*/
const event = (e) => {
  console.log(e)
}
off(dom, 'click', event)