@43081j/shadow-utils 中文文档教程

发布于 4年前 浏览 22 项目主页 更新于 3年前

shadow-utils

这个包提供了一组有用的实用程序来处理影子 DOM, 主要用于可能想要中断的测试环境情况 封装。

querySelector and querySelectorAll

以类似于本机 querySelector 的方式运行,但忽略阴影 DOM 边界,因为它遍历影子根并继续 在其中搜索给定的选择器。

Usage

// find all elements with the class, "foo"
querySelector('.foo');

// find all elements with the class "foo" within a specific node
querySelector('.foo', node);

// pass an options object
querySelector('.foo', node, options);

Options

这两个函数都可以采用这样的选项对象:

querySelector('.foo', document, options);

支持以下选项:

{
  // If true, enables cross-boundary selector support.
  // For example, `.foo .bar` would match even if `.foo` and `.bar` are
  // in different shadow roots (but still descendant-like).
  "crossBoundary": false
}

getHost

检索给定节点的宿主文档或元素。

这与手动调用 getRootNode() 类似,但只会 如果它是文档或影子根主机,则返回结果,这意味着 断开连接的节点将返回 null

Usage

// get the host of a given node
getHost(node);

shadow-utils

This package provides a set of useful utilities for dealing with shadow DOM, primarily for test environment situations where one might want to break encapsulation.

querySelector and querySelectorAll

Behaves in a similar way to the native querySelector but ignores shadow DOM boundaries, in that it traverses into shadow roots and continues searching within them for the given selector.

Usage

// find all elements with the class, "foo"
querySelector('.foo');

// find all elements with the class "foo" within a specific node
querySelector('.foo', node);

// pass an options object
querySelector('.foo', node, options);

Options

Both of these functions can take an options object like so:

querySelector('.foo', document, options);

The following options are supported:

{
  // If true, enables cross-boundary selector support.
  // For example, `.foo .bar` would match even if `.foo` and `.bar` are
  // in different shadow roots (but still descendant-like).
  "crossBoundary": false
}

getHost

Retrieves the host document or element of a given node.

This behaves similar to calling getRootNode() manually, but will only return a result if it is a document or a shadow-root host, meaning disconnected nodes will return null.

Usage

// get the host of a given node
getHost(node);
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文