问题标签 [mutation-events]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
113 浏览

javascript - 使用扩展的工具栏项时收到通知的最佳方式是什么?

我想在使用时设置label属性和事件侦听toolbaritem器。因为即使我将我的扩展添加toolbaritem<toolbarpalette id="BrowserToolbarPalette">它,document.getElementById除非它被使用,否则它不会被找到。目前我DOMNodeInserted在导航栏和附加栏上设置了我toolbaritem的属性的事件侦听器,但我想知道是否有更好的方法?

0 投票
3 回答
272 浏览

javascript - 如何找到启动 javascript 事件的位置?

我有一个 JS 脚本,它创建了一个新节点并将其插入 HTML 页面。我正在处理 DOM 突变事件并且可以捕获 DOMNodeInserted 事件。在该函数中,我想找出源(即在 HTML 的哪一部分调用了脚本函数)和目标(即在 HTML 页面中添加节点的部分)。

我可以使用 找到目标event.target,但我无法找到事件的来源。

例如,考虑以下伪代码 HTML 页面:

我希望我的源是 BODY (因为那是脚本被启动),目标应该是 div(123) (因为属性被添加到 div_123.

我怎样才能做到这一点?

0 投票
2 回答
791 浏览

javascript - 当元素发生变化时,我如何播放声音,就像 SO Chat 一样?

我想在页面上的元素更改时播放声音。我知道如何做到这一点,但我不能让它只在第一次更改时播放,以后不要这样做,直到用户聚焦窗口(选项卡)并再次模糊它。

我当前的代码:

0 投票
4 回答
718 浏览

dom - DOM 突变事件的库?

当内容被添加到网页时,我需要触发一个动作。更新可以具有不同的性质(例如 AJAX、延迟脚本、用户操作),并且不受我的控制。

我想使用 DOM 突变事件,但它们并非在所有浏览器中都可用。是否有为此提供后备计划的跨浏览器库?

另外,我很想知道 Internet Explorer 9 是否支持这些 DOM 突变事件。

谢谢!

0 投票
2 回答
1313 浏览

javascript - DOMNodeInserted 或 hashchange

我正在尝试编写一个“覆盖”在 Facebook 页面顶部的 JavaScript 脚本。它使用 DOMContentLoaded 来检测何时加载内容,然后添加一些额外的内容。但是,由于 Facebook 在转到新页面时实际上并没有“重新加载”页面(它只是使用 AJAX),所以 DOMContentLoaded 处理程序不会运行再次,即使有新的东西要浏览。

无论如何,为了检测更改,我考虑使用 onhashchange 因为 Facebook 曾经更改页面的哈希值,但是在 Firefox 4 中(我需要支持 Firefox 3 及更高版本,但没有其他浏览器),Facebook 不会更改哈希值不再,在 Firefox 3.6 之前的版本中没有 onhashchange。

我考虑过使用 DOMNodeInserted,但这真的会减慢页面速度吗?(我真的不能在这个脚本中放慢速度。)

0 投票
1 回答
1074 浏览

dom - 在类似 AJAX 的场景中单击后未选中单选按钮

我有一个文本字段,其更改事件绑定到一个验证文本字段值的函数,并可能将相应的验证错误消息拼接到文本字段上方的 DOM 中。如果通过单击一对有些不相关的单选按钮中的一个触发更改事件,则单击的单选按钮将获得焦点,但与我和用户的期望相反,它不会被选中 - 这就是问题所在。

虽然最终系统中的验证将使用 AJAX 在服务器端进行,但以下代码表明 AJAX 与该问题无关。

你能告诉我我在这里缺少什么吗:

0 投票
2 回答
194 浏览

javascript - Javascript中的突变事件不起作用

我正在尝试使用 Javascript 监听 XML 结构的变化。我有以下代码:

这是行不通的。但是,以下代码确实有效:

我在这里想念什么?

0 投票
3 回答
2212 浏览

javascript - 功能检测:JavaScript 中的突变事件可用性?

我的 JavaScript 如何检测事件是否可用?

我知道一些很棒的事件兼容性表,但我需要使用功能检测,而不是浏览器嗅探和查找表。

具体来说,我的 JS 充分利用了 DOM 突变事件 (DOMNodeInsertedDOMSubtreeModified)——它在除(当然)Internet Explorer 之外的所有浏览器中都运行良好。

那么,我将如何检测浏览器是否支持DOMNodeInserted

0 投票
5 回答
2396 浏览

javascript - 修改尚未创建的元素的首选方式(事件除外)

有很多关于将未来的操作绑定到不存在的元素的问题,最终都用live /delegate来回答。我想知道如何对与选择器匹配的所有现有元素以及与尚未创建的同一选择器匹配的所有未来元素运行任意回调(例如添加类或触发插件) 。

似乎 livequery 插件的主要功能使其成为核心,但另一部分,附加任意回调不知何故丢失了。

另一个常见的答案是事件委托,但是如果一个人无法访问创建元素以触发事件的所有供应商代码怎么办?


这是一些真实世界的代码:


一种方法是监控何时添加/删除新节点并重新触发我们的选择器。感谢@arnorhs,我们知道了DOMNodeInserted事件,我会忽略跨浏览器问题,希望那些小的 IE 补丁有朝一日可以到达 jQuery 的上游,或者知道可以包装 jQuery DOM 函数。

但是,即使我们可以确保 DOMNodeInserted 触发跨浏览器,使用多个选择器绑定到它也是荒谬的。可以随时创建数百个元素,并且对这些元素中的每一个进行潜在的数十个选择器调用将会爬行。

到目前为止我最好的主意

监视 DOMNodeInserted/Deleted 和/或挂钩到 jQuery 的 DOM 操作例程以仅设置一个“重新初始化”应该发生的标志可能会更好吗?然后可能只有一个计时器每 x 秒检查一次该标志,仅在 DOM 实际更改时运行所有这些选择器/回调。

如果您快速添加/删除大量元素(如动画或____),那仍然可能非常糟糕。如果 x 较低,则必须每 x 秒为每个保存的选择器重新解析一次 DOM 可能会过于紧张,而如果 x 很高,则界面会显得迟钝。

还有其他新颖的解决方案吗?

当它允许我时,我会添加一个赏金。我为最新颖的解决方案添加了赏金!

基本上我得到的是一种更面向方面的操作 DOM 的方法。一种可以允许将来创建新元素的方法,并且应该使用初始 document.ready 修改来创建它们

JS 最近能够做很多魔法,我希望它会很明显。

0 投票
1 回答
80 浏览

javascript - 镜像 html 部分

我想创建一个带有 div 的 html 页面,该页面将包含与另一个 div 相同的内容。我希望原产地的任何变化都会反映在目的地。你能帮忙吗: 1 - 我需要听哪些 DOM 事件?2 - 我如何将事件应用到目的地?

我看到了这些事件:DOMAttrModified、DOMNodeInserted、DOMNodeRemoved、DOMSubtreeModified,但我不知道如何解析它们。