@whitesev/domutils 1.5.6 → 1.5.7

package/dist/types/src/DOMUtils.d.ts

@@ -2,11 +2,6 @@ import { DOMUtilsEvent } from "./DOMUtilsEvent";
 import type { DOMUtilsCreateElementAttributesMap } from "./types/DOMUtilsEvent";
 import { ParseHTMLReturnType, type DOMUtilsTargetElementType } from "./types/global";
 import type { WindowApiOption } from "./types/WindowApi";
-/**
- * 判断是否是元素列表
- * @param $ele
- */
-export declare const isNodeList: ($ele: any) => $ele is any[] | NodeList;
 declare class DOMUtils extends DOMUtilsEvent {
     constructor(option?: WindowApiOption);
     /** 版本号 */

package/dist/types/src/DOMUtilsCommonUtils.d.ts

@@ -60,5 +60,10 @@ declare const DOMUtilsCommonUtils: {
      * 配合 .setInterval 使用
      */
     clearInterval(timeId: number | undefined): void;
+    /**
+     * 判断是否是元素列表
+     * @param $ele
+     */
+    isNodeList($ele: any): $ele is any[] | NodeList;
 };
 export { DOMUtilsCommonUtils };

package/dist/types/src/DOMUtilsEvent.d.ts

@@ -417,4 +417,13 @@ export declare class DOMUtilsEvent {
      */
     selectorAll<K extends keyof HTMLElementTagNameMap>(selector: K): HTMLElementTagNameMap[K][];
     selectorAll<E extends Element = Element>(selector: string): E[];
+    /**
+     * 匹配元素，可使用以下的额外语法
+     */
+    matches($el: HTMLElement | Element | null | undefined, selector: string): boolean;
+    /**
+     * 根据选择器获取上层元素，可使用以下的额外语法
+     */
+    closest<K extends keyof HTMLElementTagNameMap>($el: HTMLElement | Element, selector: string): HTMLElementTagNameMap[K] | null;
+    closest<E extends Element = Element>($el: HTMLElement | Element, selector: string): E | null;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whitesev/domutils",
-  "version": "1.5.6",
+  "version": "1.5.7",
   "description": "使用js重新对jQuery的部分函数进行了仿写",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",

package/src/DOMUtils.ts

@@ -7,20 +7,12 @@ import {
 } from "./types/global";
 import type { WindowApiOption } from "./types/WindowApi";
 
-/**
- * 判断是否是元素列表
- * @param $ele
- */
-export const isNodeList = ($ele: any): $ele is any[] | NodeList => {
-	return Array.isArray($ele) || $ele instanceof NodeList;
-};
-
 class DOMUtils extends DOMUtilsEvent {
 	constructor(option?: WindowApiOption) {
 		super(option);
 	}
 	/** 版本号 */
-	version = "2025.5.26";
+	version = "2025.5.30";
 	/**
 	 * 获取元素的属性值
 	 * @param element 目标元素
@@ -55,7 +47,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			if (attrValue == null) {
 				// 获取属性
 				return DOMUtilsContext.attr(
@@ -264,7 +256,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			if (typeof property === "string") {
 				if (value == null) {
 					// 获取属性
@@ -356,7 +348,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			if (text == null) {
 				// 获取
 				return DOMUtilsContext.text(element[0] as HTMLElement);
@@ -417,7 +409,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			if (html == null) {
 				// 获取
 				return DOMUtilsContext.html(element[0] as HTMLElement);
@@ -556,7 +548,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			if (value == null) {
 				// 获取
 				return DOMUtilsContext.val(element[0] as HTMLInputElement);
@@ -626,7 +618,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			if (propValue == null) {
 				// 获取
 				return DOMUtilsContext.prop(element[0] as HTMLElement, propName);
@@ -665,7 +657,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.removeAttr($ele as HTMLElement, attrName);
@@ -694,7 +686,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.removeClass($ele as HTMLElement, className);
@@ -730,7 +722,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.removeProp($ele as HTMLElement, propName);
@@ -759,7 +751,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.replaceWith($ele as HTMLElement, newElement);
@@ -788,7 +780,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.addClass($ele as HTMLElement, className);
@@ -821,7 +813,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return false;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			let flag = true;
 			for (let index = 0; index < element.length; index++) {
 				const $ele = element[index] as HTMLElement;
@@ -868,7 +860,7 @@ class DOMUtils extends DOMUtilsEvent {
 			return;
 		}
 
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.append($ele as HTMLElement, content);
@@ -917,7 +909,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.prepend($ele as HTMLElement, content);
@@ -955,7 +947,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.after($ele as HTMLElement, content);
@@ -995,7 +987,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.before($ele as HTMLElement, content);
@@ -1033,7 +1025,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			element.forEach(($ele) => {
 				DOMUtilsContext.remove($ele as HTMLElement);
 			});
@@ -1057,7 +1049,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.empty($ele as HTMLElement);
@@ -1425,7 +1417,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.animate(
@@ -1496,7 +1488,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.wrap($ele as HTMLElement, wrapperHTML);
@@ -1636,7 +1628,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			let resultArray: HTMLElement[] = [];
 			element.forEach(($ele) => {
 				resultArray.push(DOMUtilsContext.parent($ele as HTMLElement));
@@ -1860,7 +1852,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (typeof element === "string") {
 			element = DOMUtilsContext.selectorAll(element);
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.fadeIn($ele as HTMLElement, duration, callback);
@@ -1913,7 +1905,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (typeof element === "string") {
 			element = DOMUtilsContext.selectorAll(element);
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.fadeOut($ele as HTMLElement, duration, callback);
@@ -1957,7 +1949,7 @@ class DOMUtils extends DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.toggle($ele as HTMLElement);

package/src/DOMUtilsCommonUtils.ts

@@ -184,5 +184,12 @@ const DOMUtilsCommonUtils = {
 			globalThis.clearInterval(timeId);
 		}
 	},
+	/**
+	 * 判断是否是元素列表
+	 * @param $ele
+	 */
+	isNodeList($ele: any): $ele is any[] | NodeList {
+		return Array.isArray($ele) || $ele instanceof NodeList;
+	},
 };
 export { DOMUtilsCommonUtils };

package/src/DOMUtilsEvent.ts

@@ -1,4 +1,3 @@
-import { isNodeList } from "./DOMUtils";
 import { DOMUtilsCommonUtils } from "./DOMUtilsCommonUtils";
 import { DOMUtilsData } from "./DOMUtilsData";
 import { OriginPrototype } from "./DOMUtilsOriginPrototype";
@@ -279,13 +278,15 @@ export class DOMUtilsEvent {
 							: elementItem;
 					let findValue = selectorList.find((selectorItem) => {
 						// 判断目标元素是否匹配选择器
-						if (eventTarget?.matches(selectorItem)) {
+						if (DOMUtilsContext.matches(eventTarget, selectorItem)) {
 							/* 当前目标可以被selector所匹配到 */
 							return true;
 						}
 						/* 在上层与主元素之间寻找可以被selector所匹配到的 */
-						let $closestMatches =
-							eventTarget?.closest<HTMLElement>(selectorItem);
+						let $closestMatches = DOMUtilsContext.closest<HTMLElement>(
+							eventTarget,
+							selectorItem
+						);
 						if ($closestMatches && totalParent?.contains($closestMatches)) {
 							eventTarget = $closestMatches;
 							return true;
@@ -910,7 +911,7 @@ export class DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.click(
@@ -960,7 +961,7 @@ export class DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.focus(
@@ -1015,7 +1016,7 @@ export class DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.focus(
@@ -1064,7 +1065,7 @@ export class DOMUtilsEvent {
 		if (element == null) {
 			return;
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.hover($ele as HTMLElement, handler, option);
@@ -1101,7 +1102,7 @@ export class DOMUtilsEvent {
 		if (typeof element === "string") {
 			element = DOMUtilsContext.selectorAll(element);
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.keyup($ele as HTMLElement, handler, option);
@@ -1137,7 +1138,7 @@ export class DOMUtilsEvent {
 		if (typeof element === "string") {
 			element = DOMUtilsContext.selectorAll(element);
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.keydown($ele as HTMLElement, handler, option);
@@ -1173,7 +1174,7 @@ export class DOMUtilsEvent {
 		if (typeof element === "string") {
 			element = DOMUtilsContext.selectorAll(element);
 		}
-		if (isNodeList(element)) {
+		if (DOMUtilsCommonUtils.isNodeList(element)) {
 			// 设置
 			element.forEach(($ele) => {
 				DOMUtilsContext.keypress($ele as HTMLElement, handler, option);
@@ -1394,4 +1395,132 @@ export class DOMUtilsEvent {
 			);
 		}
 	}
+	/**
+	 * 匹配元素，可使用以下的额外语法
+	 */
+	matches(
+		$el: HTMLElement | Element | null | undefined,
+		selector: string
+	): boolean {
+		selector = selector.trim();
+		if ($el == null) {
+			return false;
+		}
+
+		if (selector.match(/[^\s]{1}:empty$/gi)) {
+			// empty 语法
+			selector = selector.replace(/:empty$/gi, "");
+			return $el.matches(selector) && $el?.innerHTML?.trim() === "";
+		} else if (
+			selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)
+		) {
+			// contains 语法
+			let textMatch = selector.match(/:contains\(("|')(.*)("|')\)$/i);
+			let text = textMatch![2];
+			selector = selector.replace(/:contains\(("|')(.*)("|')\)$/gi, "");
+			// @ts-ignore
+			let content = $el?.textContent || $el?.innerText;
+			if (typeof content !== "string") {
+				content = "";
+			}
+			return $el.matches(selector) && content?.includes(text);
+		} else if (
+			selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)
+		) {
+			// regexp 语法
+			let textMatch = selector.match(/:regexp\(("|')(.*)("|')\)$/i);
+			let pattern = textMatch![2];
+			let flagMatch = pattern.match(/("|'),[\s]*("|')([igm]{0,3})$/i);
+			let flags = "";
+			if (flagMatch) {
+				pattern = pattern.replace(/("|'),[\s]*("|')([igm]{0,3})$/gi, "");
+				flags = flagMatch[3];
+			}
+			let regexp = new RegExp(pattern, flags);
+			selector = selector.replace(/:regexp\(("|')(.*)("|')\)$/gi, "");
+			// @ts-ignore
+			let content = $el?.textContent || $el?.innerText;
+			if (typeof content !== "string") {
+				content = "";
+			}
+			return $el.matches(selector) && Boolean(content?.match(regexp));
+		} else {
+			// 普通语法
+			return $el.matches(selector);
+		}
+	}
+	/**
+	 * 根据选择器获取上层元素，可使用以下的额外语法
+	 */
+	closest<K extends keyof HTMLElementTagNameMap>(
+		$el: HTMLElement | Element,
+		selector: string
+	): HTMLElementTagNameMap[K] | null;
+	closest<E extends Element = Element>(
+		$el: HTMLElement | Element,
+		selector: string
+	): E | null;
+	closest<E extends Element = Element>(
+		$el: HTMLElement | Element,
+		selector: string
+	): E | null {
+		selector = selector.trim();
+
+		if (selector.match(/[^\s]{1}:empty$/gi)) {
+			// empty 语法
+			selector = selector.replace(/:empty$/gi, "");
+			let $closest = $el?.closest<E>(selector);
+			if ($closest && $closest?.innerHTML?.trim() === "") {
+				return $closest;
+			}
+			return null;
+		} else if (
+			selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)
+		) {
+			// contains 语法
+			let textMatch = selector.match(/:contains\(("|')(.*)("|')\)$/i);
+			let text = textMatch![2];
+			selector = selector.replace(/:contains\(("|')(.*)("|')\)$/gi, "");
+			let $closest = $el?.closest<E>(selector);
+			if ($closest) {
+				// @ts-ignore
+				let content = $el?.textContent || $el?.innerText;
+				if (typeof content === "string" && content.includes(text)) {
+					return $closest;
+				}
+			}
+			return null;
+		} else if (
+			selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)
+		) {
+			// regexp 语法
+			let textMatch = selector.match(/:regexp\(("|')(.*)("|')\)$/i);
+			let pattern = textMatch![2];
+			let flagMatch = pattern.match(/("|'),[\s]*("|')([igm]{0,3})$/i);
+			let flags = "";
+			if (flagMatch) {
+				pattern = pattern.replace(/("|'),[\s]*("|')([igm]{0,3})$/gi, "");
+				flags = flagMatch[3];
+			}
+			let regexp = new RegExp(pattern, flags);
+			selector = selector.replace(/:regexp\(("|')(.*)("|')\)$/gi, "");
+			let $closest = $el?.closest<E>(selector);
+			if ($closest) {
+				// @ts-ignore
+				let content = $el?.textContent || $el?.innerText;
+				if (typeof content === "string" && content.match(regexp)) {
+					return $closest;
+				}
+			}
+			return null;
+		} else {
+			// 普通语法
+			let $closest = $el?.closest<E>(selector);
+			return $closest;
+		}
+	}
 }