等号元素

检测浏览器 DOM 中元素的外观

a.k.a 承诺 -- -- 选择者

• 保证API
• 开车经过 MutationObserver
• 探测到的 querySelecrtor
• 可用 AbortSignal

如果目标元素在执行"等待元素"时已经存在,则立即 resolve 并返回元素.

安装

npm install @1natsu/wait-element

yarn add @1natsu/wait-element

pnpm add @1natsu/wait-element

bun add @1natsu/wait-element

使用量

模块规格

import { waitElement } from "@1natsu/wait-element";

总之

const el = await waitElement(".late-comming");
console.log(el);
//=> example: "<div class="late-comming">I'm late</div>"

指定母目标元素( 请指定突变目标)

const parent = await waitElement("#parent");
const el = await waitElement(".late-comming", { target: parent });
console.log(el);
//=> example: "<div class="late-comming">I'm late</div>"

设置超时

const el = await waitElement(".late-comming", { signal: AbortSignal.timeout(1000) }).catch(err => console.log(err));
console.log(el);
//=> If detected element: "<div class="late-comming">I'm late</div>"
//=> If timeouted: DOMException: TimeoutError

终止等待

try {
    const waitAbortable = new AbortController();

    const checkElement = waitElement(".late-comming", { signal: waitAbortable.signal });

    waitAbortable.abort("abort this time!");

} catch(error) {
    // After abort handling...
}

自定义检测条件

const el = await waitElement("#animal", {
  detector: (element) =>
        element?.textContent === "Tiger"
            ? { isDetected: true, result: element }
            : { isDetected: false },
});
console.log(el.textContent);
//=> example: Tiger

import { isNotExist } from "@1natsu/wait-element/detectors";

// when resolve if “not exist” or “disappear” at the time of call
const result = await waitElement(".hero", { detector: isNotExist });
//=> result: null

统一等待程序

统一查找元素的过程。 如果设定 true,提高效率。 将相同的参数(包括选项)相互统一.

const A = waitElement(".late-comming", {
    unifyProcess: true,
});

const B = waitElement(".late-comming", {
    unifyProcess: true,
});

const C = waitElement(".late-comming", {
    unifyProcess: true,
    signal: AbortSignal.timeout(1000)
});

const D = waitElement(".late-comming", {
    unifyProcess: false,
});

// Unified:
// A === B
// B !== C
// B !== D

API 密码

等待元素( 选择器, [选项])

选择器

类型 : string

格式为 CSS 选择器

选项

通过的选项与默认配置合并.

详情见TS定义

创建waitElement( 最小选项)

自定义等离子函数可以创建 .

类似

类似图书馆.

• 元素准备
  • 执行方法与这个库不同.

许可证

麻省理工学院 1纳通172