DOM 突变事件库?

2024-01-06

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

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

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

Thanks!


有两种方法可以做到这一点...

一,你可以拍摄 dom 的快照(var snap = document.body),与100ms后的dom进行比较,然后重置snap再次到身体。我会让你发挥创意来比较它们:迭代似乎是常见的答案。这并不漂亮。

另一种选择是在您创建的用于在应用程序中添加/删除元素的任何函数中具有特殊函数。该函数将仅迭代您添加(或销毁)的元素并查找匹配项。

/* Shim matchesSelector */
if (!Element.prototype.matchesSelector) {
    Element.prototype.matchesSelector =
    Element.prototype.matches ||
    Element.prototype.webkitMatchesSelector ||
    Element.prototype.mozMatchesSelector ||
    Element.prototype.msMatchesSelector ||
    Element.prototype.oMatchesSelector;
}

function addingToDom(elm){

    /* Whichever method you want to use to map selectors to functions */
    var callbacks = array(['.class', fn-reference1], ['#id', fn-reference2], ['div', fn-reference3]);

    /* go through all the elements you're adding */
    for (var i = 0; i<elm.length; ++i){
        /* go through all the selectors you're matching against */
        for (var k = 0; k<callbacks.length ++k){
            if(elm[i].matchesSelector(callbacks[k][0])){
                /* call function with element passed as parameter */
                callbacks[k][1](elm[i]);
            }
        }
    }
}

这可能并不完美,但它应该能让您知道前进的方向。调用此函数 (addingToDom),传递刚刚添加的元素作为参数。创建一个类似的函数来删除元素(或相同的函数,但条件是一个单独的回调数组)。

这是我用来测试一些想法的当前(大而混乱)代码的推断。我已经用这个垫片测试了早至 ie7 的匹配选择器,它似乎工作得很好!

我已经考虑过,但没有研究过,元素具有某种参数的可能性,这些参数可以设置为一个函数,该函数在添加时被调用,并将其自身作为参数传递。但是,这可能是牵强的。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

DOM 突变事件库? 的相关文章

随机推荐

  • ASP.NET MVC:路由层次结构 URL

    我该如何为此制定路由 URL 类别 主 子 or 类别 主 sub1 subsub 我希望有 主 子 and 主 子1 子子 作为 CategoryController 的 Index 操作方法中的参数 找到了答案 应在路由路径中使用 ca
  • 使用 Node 'pg' 库连接到 Amazon Redshift

    我尝试使用 pg 库将我的 API 连接到 Redshift 实例 但出现以下错误 Possibly unhandled error SET TIME ZONE is not supported at Connection parseE U
  • Http 304 和缓存控制:无缓存

    我看到对网络服务器的一些调用的以下响应 初始调用 HTTP 1 1 200 OK Date Mon 16 Jan 2012 05 46 49 GMT X Powered By Servlet 2 5 JSP 2 1 Content Type
  • 向 D3 和弦图添加标签

    我是一名菜鸟程序员 所以这对于你们大多数人来说可能是一个简单的任务 此和弦图的标签和 或鼠标悬停文本需要哪些代码行 http mbostock github com d3 ex chord html http mbostock github
  • 在 azure 搜索中索引字典属性

    我有一个具有 type 属性的 DTODictionary
  • TextInputLayout 错误状态下的提示颜色

    根据 Google 的材料指南 https material io guidelines components text fields html text fields layout https material io guidelines
  • 拖动列时显示列标题

    我在中实现代码可分组标题 http www java2s com Code Java Swing Components GroupableGroupHeaderExample htm并尝试启用允许的重新排序 但我有两个问题 1 拖动列时 标
  • 使用自定义插值内核的 MATLAB imresize

    如何使用我的函数作为 MATLAB 中 imresize 函数的插值方法 我阅读了MATLAB关于如何使用自定义函数进行插值方法的帮助 但没有任何明确的示例 我试着为妈妈写一段代码 The imresize命令将默认使用bicubic方法
  • 这个只有一个操作数的 x86-64 addq 指令是什么意思? (摘自CSAPP书籍第三版)

    在下面的说明中 addq 是如何工作的 它只有一个操作数 书上声称它递增 rdx 但 rdx 不在这条指令中 我感到很困惑 这是来自 计算机系统 程序员的视角 一书 第三版 正如 Jester 在评论中指出的那样 这确实是一个错误 我实际上
  • 如何在带引号的表达式中转义扩展路径名扩展模式?

    除了基本的 and 模式 Bash shell 提供了扩展的模式匹配运算符 例如 pattern list 匹配除给定模式之一之外的所有模式 这extglob需要设置 shell 选项才能使用它们 一个例子 mkdir test cd te
  • 根据项目特定情况设置函数默认值 R

    通常 我使用相同的功能设置 我想知道除了在路径中拥有一个本质上是函数包装器的新对象之外 是否还有一种方法来设置默认参数 例如 paste 有它的sep参数设置为空格 我写累了 sep 一遍又一遍 那么有没有办法 暂时 用我选择的默认值替换该
  • 如何从 SVN 的修订版本中删除 1 个文件?

    我的一位同事在 SVN 中签入了一些文件 其中一个文件中有密码 密码已从文件中删除 并签入了新版本 但如果我们查看修订历史记录并转到该修订版本 密码显然仍在存储库中 我们使用 TortoiseSVN 作为客户端 那么如何安全地从 SVN 存
  • Apple iTunes Connect Analytics:归因提供商和营销活动 ID 值传递给应用程序委托

    新的 iTunes Connect 现在具有分析功能 您可以在 URL 中指定提供商 pid ID 和活动 ID cid 例如 您可以将这些值传递到应用程序中以用于各种目的吗 即使经过检查 我也找不到任何表明这一点的内容 didFinish
  • CamelCasePropertyNamesContractResolver 在 MapHttpRoute 之后不工作

    我正在尝试在我的 Net API 项目中实现 JSON 驼峰式大小写 在我的启动类中 我添加了以下几行 config Formatters JsonFormatter SerializerSettings ContractResolver
  • ASP.NET MVC 中的模型绑定嵌套集合

    我正在使用史蒂夫 桑德森的BeginCollectionItem 帮助器 http blog stevensanderson com 2010 01 28 editing a variable length list aspnet mvc
  • Rails 3 - 如何从 link_to 创建新记录

    我正在尝试创建一个 标签 功能 允许用户 标记 他们感兴趣的项目 这是我的模型 class tag belongs to user belongs to item end 对应的DB表有必要的 user id and item id字段 在
  • 通过WebService发送电子邮件

    我在Windows上开发了应用程序 现在我需要通过 Web 服务发送一封电子邮件 包括附件功能 我怎样才能做到这一点 我还需要在 n 天之前通知电子邮件 n 天是由用户控制的功能 如果有任何意见请告诉我 Thanks public bool
  • 如何使用另一个位图作为掩码在位图上绘图?

    我想要draw在位图上使用另一个位图作为掩码 蒙版是一个黑色位图 其中有一个透明对象 我希望这个透明部分填充任意颜色并添加到我的原始图像中 如何才能做到这一点 蓝色 我必须按照 Christian 的描述更换面具 然后 可以很容易地产生想要
  • GLSL:无法获取制服位置

    我的问题是 我无法获得某些制服的位置 而其他制服的位置我却没有问题 例如 我的 VS 制服称为 MVP 和 模特 并且 MVP 位置没有问题 但我没有对称使用的 模特 位置 以同样的方式 我无法从 FS 中的 Light 结构中获取字段的位
  • DOM 突变事件库?

    当内容添加到网页时 我需要触发一个操作 更新可以具有不同的性质 例如 AJAX 延迟脚本 用户操作 并且不受我的控制 我想使用 DOM 突变事件 但它们并非在所有浏览器中都可用 是否有跨浏览器库提供后备计划 另外 我很想知道 Interne