@whitesev/domutils 1.4.3 → 1.4.5

package/dist/index.system.js

@@ -181,8 +181,9 @@ System.register('DOMUtils', [], (function (exports) {
                      * @param option
                      */
                     function getOption(args, startIndex, option) {
-                        if (typeof args[startIndex] === "boolean") {
-                            option.capture = args[startIndex];
+                        let currentParam = args[startIndex];
+                        if (typeof currentParam === "boolean") {
+                            option.capture = currentParam;
                             if (typeof args[startIndex + 1] === "boolean") {
                                 option.once = args[startIndex + 1];
                             }
@@ -190,13 +191,15 @@ System.register('DOMUtils', [], (function (exports) {
                                 option.passive = args[startIndex + 2];
                             }
                         }
-                        else if (typeof args[startIndex] === "object" &&
-                            ("capture" in args[startIndex] ||
-                                "once" in args[startIndex] ||
-                                "passive" in args[startIndex])) {
-                            option.capture = args[startIndex].capture;
-                            option.once = args[startIndex].once;
-                            option.passive = args[startIndex].passive;
+                        else if (typeof currentParam === "object" &&
+                            ("capture" in currentParam ||
+                                "once" in currentParam ||
+                                "passive" in currentParam ||
+                                "isComposedPath" in currentParam)) {
+                            option.capture = currentParam.capture;
+                            option.once = currentParam.once;
+                            option.passive = currentParam.passive;
+                            option.isComposedPath = currentParam.isComposedPath;
                         }
                         return option;
                     }
@@ -233,27 +236,28 @@ System.register('DOMUtils', [], (function (exports) {
                         selectorList.push(selector);
                     }
                     // 事件回调
-                    let _callback_ = callback;
+                    let listenerCallBack = callback;
                     // 事件配置
-                    let _option_ = {
+                    let listenerOption = {
                         capture: false,
                         once: false,
                         passive: false,
+                        isComposedPath: false,
                     };
                     if (typeof selector === "function") {
                         /* 这是为没有selector的情况 */
-                        _callback_ = selector;
-                        _option_ = getOption(args, 3, _option_);
+                        listenerCallBack = selector;
+                        listenerOption = getOption(args, 3, listenerOption);
                     }
                     else {
                         /* 这是存在selector的情况 */
-                        _option_ = getOption(args, 4, _option_);
+                        listenerOption = getOption(args, 4, listenerOption);
                     }
                     /**
                      * 如果是once，那么删除该监听和元素上的事件和监听
                      */
                     function checkOptionOnceToRemoveEventListener() {
-                        if (_option_.once) {
+                        if (listenerOption.once) {
                             DOMUtilsContext.off(element, eventType, selector, callback, option);
                         }
                     }
@@ -263,53 +267,60 @@ System.register('DOMUtils', [], (function (exports) {
                          * @param event
                          */
                         function domUtilsEventCallBack(event) {
-                            let target = event.target;
+                            let eventTarget = listenerOption.isComposedPath
+                                ? event.composedPath()[0]
+                                : event.target;
                             if (selectorList.length) {
-                                /* 存在自定义子元素选择器 */
+                                /* 存在子元素选择器 */
                                 let totalParent = DOMUtilsCommonUtils.isWin(elementItem)
                                     ? DOMUtilsContext.windowApi.document.documentElement
                                     : elementItem;
                                 for (let index = 0; index < selectorList.length; index++) {
                                     const selectorItem = selectorList[index];
-                                    if (target.matches(selectorItem)) {
+                                    if (eventTarget.matches(selectorItem)) {
                                         /* 当前目标可以被selector所匹配到 */
-                                        _callback_.call(target, event);
+                                        listenerCallBack.call(eventTarget, event);
                                         checkOptionOnceToRemoveEventListener();
                                         break;
                                     }
-                                    else if (target.closest(selectorItem) &&
-                                        totalParent.contains(target.closest(selectorItem))) {
+                                    else {
                                         /* 在上层与主元素之间寻找可以被selector所匹配到的 */
-                                        let closestElement = target.closest(selectorItem);
-                                        /* event的target值不能直接修改 */
-                                        OriginPrototype.Object.defineProperty(event, "target", {
-                                            get() {
-                                                return closestElement;
-                                            },
-                                        });
-                                        _callback_.call(closestElement, event);
-                                        checkOptionOnceToRemoveEventListener();
-                                        break;
+                                        let $closestMatches = eventTarget.closest(selectorItem);
+                                        if ($closestMatches && totalParent.contains($closestMatches)) {
+                                            /* event的target值不能直接修改 */
+                                            // 这里尝试使用defineProperty修改event的target值
+                                            try {
+                                                OriginPrototype.Object.defineProperty(event, "target", {
+                                                    get() {
+                                                        return $closestMatches;
+                                                    },
+                                                });
+                                            }
+                                            catch (error) { }
+                                            listenerCallBack.call($closestMatches, event);
+                                            checkOptionOnceToRemoveEventListener();
+                                            break;
+                                        }
                                     }
                                 }
                             }
                             else {
-                                _callback_.call(elementItem, event);
+                                listenerCallBack.call(elementItem, event);
                                 checkOptionOnceToRemoveEventListener();
                             }
                         }
                         /* 遍历事件名设置元素事件 */
                         eventTypeList.forEach((eventName) => {
-                            elementItem.addEventListener(eventName, domUtilsEventCallBack, _option_);
+                            elementItem.addEventListener(eventName, domUtilsEventCallBack, listenerOption);
                             /* 获取对象上的事件 */
                             let elementEvents = elementItem[DOMUtilsData.SymbolEvents] || {};
                             /* 初始化对象上的xx事件 */
                             elementEvents[eventName] = elementEvents[eventName] || [];
                             elementEvents[eventName].push({
                                 selector: selectorList,
-                                option: _option_,
+                                option: listenerOption,
                                 callback: domUtilsEventCallBack,
-                                originCallBack: _callback_,
+                                originCallBack: listenerCallBack,
                             });
                             /* 覆盖事件 */
                             // @ts-ignore
@@ -325,12 +336,13 @@ System.register('DOMUtils', [], (function (exports) {
                      * @param option
                      */
                     function getOption(args1, startIndex, option) {
-                        if (typeof args1[startIndex] === "boolean") {
-                            option.capture = args1[startIndex];
+                        let currentParam = args1[startIndex];
+                        if (typeof currentParam === "boolean") {
+                            option.capture = currentParam;
                         }
-                        else if (typeof args1[startIndex] === "object" &&
-                            "capture" in args1[startIndex]) {
-                            option.capture = args1[startIndex].capture;
+                        else if (typeof currentParam === "object" &&
+                            "capture" in currentParam) {
+                            option.capture = currentParam.capture;
                         }
                         return option;
                     }
@@ -368,20 +380,31 @@ System.register('DOMUtils', [], (function (exports) {
                     /**
                      * 事件的回调函数
                      */
-                    let _callback_ = callback;
+                    let listenerCallBack = callback;
                     /**
                      * 事件的配置
                      */
-                    let _option_ = {
+                    let listenerOption = {
                         capture: false,
                     };
                     if (typeof selector === "function") {
                         /* 这是为没有selector的情况 */
-                        _callback_ = selector;
-                        _option_ = getOption(args, 3, _option_);
+                        listenerCallBack = selector;
+                        listenerOption = getOption(args, 3, listenerOption);
                     }
                     else {
-                        _option_ = getOption(args, 4, _option_);
+                        listenerOption = getOption(args, 4, listenerOption);
+                    }
+                    // 是否移除所有事件
+                    let isRemoveAll = false;
+                    if (args.length === 2) {
+                        // 目标函数、事件名
+                        isRemoveAll = true;
+                    }
+                    else if ((args.length === 3 && typeof args[2] === "string") ||
+                        Array.isArray(args[2])) {
+                        // 目标函数、事件名、子元素选择器
+                        isRemoveAll = true;
                     }
                     elementList.forEach((elementItem) => {
                         /* 获取对象上的事件 */
@@ -394,26 +417,25 @@ System.register('DOMUtils', [], (function (exports) {
                             }
                             for (let index = 0; index < handlers.length; index++) {
                                 let handler = handlers[index];
-                                let flag = false;
-                                if (!selectorList.length) {
-                                    // selectorList是空的，默认移除
-                                    flag = true;
+                                let flag = true;
+                                if (flag &&
+                                    listenerCallBack &&
+                                    handler.originCallBack !== listenerCallBack) {
+                                    // callback不同
+                                    flag = false;
                                 }
-                                else {
-                                    if (Array.isArray(handler.selector) &&
-                                        JSON.stringify(handler.selector) === JSON.stringify(selectorList)) {
-                                        // 元素上的selectorList不为空且和传入的相同
-                                        flag = true;
+                                if (flag && selectorList.length && Array.isArray(handler.selector)) {
+                                    if (JSON.stringify(handler.selector) !== JSON.stringify(selectorList)) {
+                                        // 子元素选择器不同
+                                        flag = false;
                                     }
                                 }
-                                if (!_callback_ ||
-                                    handler.callback === _callback_ ||
-                                    handler.originCallBack === _callback_) {
-                                    /* callback不为空，且callback相同 */
-                                    flag = true;
+                                if (flag && listenerOption.capture !== handler.option.capture) {
+                                    // 事件的配置项不同
+                                    flag = false;
                                 }
-                                if (flag) {
-                                    elementItem.removeEventListener(eventName, handler.callback, _option_);
+                                if (flag || isRemoveAll) {
+                                    elementItem.removeEventListener(eventName, handler.callback, handler.option);
                                     handlers.splice(index--, 1);
                                 }
                             }
@@ -1015,7 +1037,7 @@ System.register('DOMUtils', [], (function (exports) {
                     super(option);
                 }
                 /** 版本号 */
-                version = "2024.12.3";
+                version = "2024.12.4";
                 attr(element, attrName, attrValue) {
                     let DOMUtilsContext = this;
                     if (typeof element === "string") {