@whitesev/domutils 1.4.3 → 1.4.4

package/dist/index.umd.js

@@ -182,8 +182,9 @@
              * @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];
                     }
@@ -191,13 +192,15 @@
                         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;
             }
@@ -234,27 +237,28 @@
                 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);
                 }
             }
@@ -264,53 +268,56 @@
                  * @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值不能直接修改 */
+                                    OriginPrototype.Object.defineProperty(event, "target", {
+                                        get() {
+                                            return $closestMatches;
+                                        },
+                                    });
+                                    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
@@ -326,12 +333,13 @@
              * @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;
             }
@@ -369,20 +377,31 @@
             /**
              * 事件的回调函数
              */
-            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) => {
                 /* 获取对象上的事件 */
@@ -395,26 +414,25 @@
                     }
                     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);
                         }
                     }