我需要创建一个简单的工具提示库，其工作原理如下：
每个具有特定属性组合的 DOM 元素（例如 class="tooltip"、data-tooltip-text="some text"）会在悬停时自动显示工具提示（包含来自数据 attr 的文本）。
此行为必须通过外部 DOM 操作持续存在。我真的很喜欢利用HTML集合 https://developer.mozilla.org/en-US/docs/Web/API/HTMLCollection为此，因为它的“实时”性质，因为每次 DOM 更改都迭代整个 DOM 听起来可能非常要求。
现在我很想观看/收听该集合，并在每次更改时运行一个序列（遍历节点，查看它们是否有侦听器，如果没有则添加它）。
我该怎么做呢？这watch https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/watch and observe https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/observe方法似乎（如果我理解正确的话）能够做到这一点，但它们现在已被弃用。 MDN 是这么说的Proxy https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy涵盖了大多数用例，但它是否涵盖了我的用例（我还没有找到使其工作的方法）？或者我还缺少其他什么方式吗？
那么呢变异观察者 https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver？我认为深入观察整个应用程序并在每次更改时通过 querySelectorAll 重复获取新的 NodeList 要求太高（该库应该在 React 应用程序上运行）。通过 React 将 HTMLCollection（作为值）动态提交到 DOM 中，然后（浅层）使用 MutationObserver 监听更改可能会起作用，但我怀疑这是否是一个好主意。
None
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
