system-apps/apps/ui/src/utils/query-el.ts
2024-11-01 23:53:45 +08:00

55 lines
1.3 KiB
TypeScript

import { obj2css, ObjCss } from './css';
import parse from 'style-to-object';
export type SelectEl = string | HTMLDivElement;
export const querySelector = (el?: string | HTMLDivElement): HTMLDivElement | null => {
if (!el) {
return null;
}
if (typeof el === 'string') {
return document.querySelector(el) as HTMLDivElement;
}
return el;
};
export type ElStyle = ObjCss | string;
/**
* el add class and style
* @param el
* @param className
* @param style
* @returns
*/
export const elAddCS = (el: HTMLDivElement, className?: string, style?: ElStyle) => {
if (!el) return;
if (className) {
el.classList.add(className);
}
if (style && typeof style === 'string') {
el.style.cssText = style;
} else if (style) {
obj2css(el, style as ObjCss);
}
};
/**
* 添加style的同时保留默认的的style
* @param el
* @param className
* @param style
* @param defaultStyle
* @returns
*/
export const elAddCS2 = (el: HTMLDivElement, className?: string, style?: ElStyle, defaultStyle?: ObjCss) => {
if (!el) return;
if (className) {
el.classList.add(className);
}
let _style: ObjCss = { ...defaultStyle };
if (style && typeof style === 'string') {
_style = { ...defaultStyle, ...parse(style) };
} else if (style && typeof style === 'object') {
_style = { ...defaultStyle, ...style };
}
obj2css(el, _style);
};