问题标签 [mutation-events]

我在我们的网站上进行 A/B 测试，我的大部分工作是在一个 JS 文件中，该文件在呈现其他任何内容之前加载在页面顶部，但在 jQuery 加载之后，有时会派上用场。

以更改 H1 标签的一个非常简单的示例为例，我通常会在头部注入一个样式以将 H1 不透明度设置为 0，然后在 DOMContentLoaded 上，我会操纵 H1 内容，然后将不透明度设置为 1。原因是避免在更改发生之前闪现旧内容 - 隐藏整个对象在眼睛上更加优雅。

我已经开始研究 MutationObserver API。我之前在更改用户可以打开的覆盖对话框中的内容时使用过它，这似乎是一种很酷的方法，我想知道是否有人设法使用 MutationObserver 在第一次加载时收听文档/在第一次渲染之前和 DOMContentLoaded 之前解析和更改文档？

然后，这种方法可以让我更改 H1 内容，而不必隐藏它、更改它，然后显示它。

到目前为止，我已经尝试过但失败了，并且刚刚阅读了有关即将过时的 Mutation Events 并想知道我是否正在尝试做一些不可能的事情。但是我们（不是我）已经设法在火星上放置了一个机器人，所以我希望我能解决这个问题。

那么是否可以在页面加载/解析时使用 MutationObservers 即时更改 HTML 内容？

感谢您的任何帮助或任何指示。

问候，尼克

I have been using an open source library called tree-mirror.js which uses mutation-summary.js to do the DOM mirroring.

Everything is good but iframes. When the main document contains an iframe, the dom changes to the document with in the iframe are not captured by these libraries. What I could figure out from reading the code of tree-mirror.js is that it binds mutation observer to the main document but did not understand if this can handle the iframe documents also automatically.

I am not sure if this is not supported by the libraries or I am missing something. Did anyone work with these libraries and encountered this issue? Kindly help.

我目前正在学习 Javascript，其中一章是“Mutation Observer”。我正在尝试创建一个简单的函数来检测是否将新 div 添加到页面并将其显示在控制台中。但是，我收到了这条消息，我很难找到解决这个错误的解决方案。如果有人能向我解释我做错了什么，我将不胜感激。先感谢您！

未捕获的 TypeError：无法在“MutationObserver”上执行“观察”：参数 1 不是“节点”类型。

到目前为止，这是我写的代码：

当我们尝试使用 appendChild 或 innerHTML 在 DOM 中添加嵌套节点时，嵌套节点不会出现在突变的 addedNodes 中。

初始 HTML 设置：

这是我的突变观察者代码：

如果我现在在 div 中使用嵌套的 img 节点执行 appendChild，

Mutation Observer 仅记录附加到容器的div，但不会将img记录为突变中的 addedNode。

这是一个有效的 JSFiddle：https ://jsfiddle.net/aedhefhn/

有解决方法吗？

我在为 Firefox 浏览器编写插件时遇到问题。当 CSS 类出现“error-class”或“warn-class”时，插件应该会发出声音。我使用突变观察器来检查我的班级是否出现并存储我播放声音的事实。

它用于 Grafana 仪表板，使用状态面板在服务未按时响应时发出警报。

这是我的实际代码：

这里是清单：

预期的结果是当“错误类”出现在 html 页面的元素上时，播放 base64 中的声音

之后 chrome.debugger.sendCommand({tabId:tabId}, "DOM.enable")，我发现只有事件DOM.documentUpdated可以触发，但其他的：

无法触发。我想我应该错过一些设置类似 MutationObserver 选项的调用：

我需要为此调用任何其他 chrome.debugger 命令吗？

谢谢。

我有一个 iframe 正在呈现来自另一个域的内容。显然我无法contentDocument从其他域访问（返回null）。但是当用户对呈现的 iframe 执行操作时，它会重定向回我的域。因此，那时我可以阅读该文档。基本上一旦 contentDocument 不是null，我想执行一个动作。

目前我只是想在 iframe 的孩子（在这种情况下它contentDocument发生变异......

但是即使添加了子节点并且 iframe 中的元素发生了变化，警报也不会触发。我读过很多例子，但也许我仍然想念它是如何工作的。有人可以帮助解释为什么这个观察者没有触发突变吗？

提前致谢

我已经尝试学习 vuex 好几个星期了（我看过几十个教程，他们只是通过反例来学习）。我很慢，仍然无法掌握如何做到这一点。
我的想法是能够在组件之间切换选项卡。我知道我应该使用一个动作来激活突变（我无法做到）但是我认为突变应该仍然可以在按下按钮时起作用？

我的问题是如何正确设置在单击按钮时传递组件值的突变？
另外我想知道我的组件切换想法是否会起作用，或者是否有更好的方法来做到这一点。

SignUp.vue

store/index.js

SeperateComponent.vue