@whitesev/utils 2.2.4 → 2.2.6

package/dist/index.umd.js

@@ -3657,7 +3657,7 @@
             this.windowApi = new WindowApi(option);
         }
         /** 版本号 */
-        version = "2024.9.4";
+        version = "2024.9.10";
         addStyle(cssText) {
             if (typeof cssText !== "string") {
                 throw new Error("Utils.addStyle 参数cssText 必须为String类型");
@@ -4353,32 +4353,66 @@
                 return Math.max(...newResult);
             }
         }
-        getMaxZIndex(deviation = 1) {
+        getMaxZIndexNodeInfo(deviation = 1) {
             deviation = Number.isNaN(deviation) ? 1 : deviation;
+            const UtilsContext = this;
             // 最大值2147483647
-            let maxZIndex = Math.pow(2, 31) - 1;
+            const maxZIndex = Math.pow(2, 31) - 1;
             // 比较值2000000000
-            let maxZIndexCompare = 2 * Math.pow(10, 9);
+            const maxZIndexCompare = 2 * Math.pow(10, 9);
             // 当前页面最大的z-index
             let zIndex = 0;
-            this.windowApi.document.querySelectorAll("*").forEach(($ele, index) => {
-                let nodeStyle = this.windowApi.window.getComputedStyle($ele);
+            // 当前的最大z-index的元素，调试使用
+            // @ts-ignore
+            let maxZIndexNode = null;
+            /**
+             * 元素是否可见
+             * @param $css
+             */
+            function isVisibleNode($css) {
+                return $css.position !== "static" && $css.display !== "none";
+            }
+            /**
+             * 查询元素的z-index
+             * 并比较值是否是已获取的最大值
+             * @param $ele
+             */
+            function queryMaxZIndex($ele) {
+                /** 元素的样式 */
+                const nodeStyle = UtilsContext.windowApi.window.getComputedStyle($ele);
                 /* 不对position为static和display为none的元素进行获取它们的z-index */
-                if (nodeStyle.position !== "static" && nodeStyle.display !== "none") {
+                if (isVisibleNode(nodeStyle)) {
                     let nodeZIndex = parseInt(nodeStyle.zIndex);
                     if (!isNaN(nodeZIndex)) {
                         if (nodeZIndex > zIndex) {
+                            // 赋值到全局
                             zIndex = nodeZIndex;
+                            maxZIndexNode = $ele;
                         }
                     }
+                    // 判断shadowRoot
+                    if ($ele.shadowRoot != null && $ele instanceof ShadowRoot) {
+                        $ele.shadowRoot.querySelectorAll("*").forEach(($shadowEle) => {
+                            queryMaxZIndex($shadowEle);
+                        });
+                    }
                 }
+            }
+            this.windowApi.document.querySelectorAll("*").forEach(($ele, index) => {
+                queryMaxZIndex($ele);
             });
             zIndex += deviation;
             if (zIndex >= maxZIndexCompare) {
                 // 最好不要超过最大值
                 zIndex = maxZIndex;
             }
-            return zIndex;
+            return {
+                node: maxZIndexNode,
+                zIndex: zIndex,
+            };
+        }
+        getMaxZIndex(deviation = 1) {
+            return this.getMaxZIndexNodeInfo(deviation).zIndex;
         }
         getMinValue(...args) {
             let result = [...args];
@@ -5297,6 +5331,10 @@
          * @param target 目标元素
          * @param callback 触发的回调
          * @param options 观察器配置
+         * @example
+         * Utils.mutationVisible(document.querySelector("div.xxxx"),(entries,observer)=>{
+         *     console.log("该元素出现在视图内");
+         * }))
          */
         mutationVisible(target, callback, options) {
             if (typeof IntersectionObserver === "undefined") {