MutationObserverInit.attributeFilter - Web API 接口参考 编辑

MutationObserverInit 字典的可选属性 attributeFilter 是一个字符串数组，用于指定要监听变化的属性名称。 如果指定了该属性，则 attributes 无论是否为 true，属性监听都将启用。

如果属性 attributes 设置为 true ，但options对象中未包含 attributeFilter ，则所有属性的变化都会被监听。

语法

var options = {
  attributeFilter: [ "list", "of", "attribute", "names" ]
}

值

DOMString数组， 每项指定一个要监听其变化的属性名称，没有默认值。

当使用构造函数MutationObserver()创建MutationObserver对象时，如果options对象中存在该属性，则无论attributes是否为true，都将启用属性监听。

示例

在本示例中，设置了一个变化监听器来监听用于显示聊天室用户名的子树中所有元素的status和username属性的变化。这样就可以反应用户昵称或状态的更改， 例如，可以将用户标记为离开或离线。

function callback(mutationList) {
  mutationList.forEach(function(mutation) {
    switch(mutation.type) {
      case "attributes":
        switch(mutation.attributeName) {
          case "status":
            userStatusChanged(mutation.target.username, mutation.target.status);
            break;
          case "username":
            usernameChanged(mutation.oldValue, mutation.target.username);
            break;
        }
        break;
    }
  });
}

var userListElement = document.querySelector("#userlist");

var observer = new MutationObserver(callback);
observer.observe(userListElement, {
  attributeFilter: [ "status", "username" ],
  attributeOldValue: true,
  subtree: true
});

callback()函数将在监听器启动时传给observe()方法，用来检查MutationRecord对象的每一项。对于代表属性更改的任何项（可以通过MutationRecord.type的值为“ attributes”的值来检测），我们使用通过MutationRecord.attributeName获得的属性名称来识别发生的更改的类型，然后将其分派给适当的处理函数。

请注意，在查找本地用户数组时可以使用MutationRecord.oldValue来获取username的上一个值。

当observe()被调用时， options对象中指定了attributeFilter和subtree，所以id为“userlist”的元素的所有子树的所有节点的属性值都会被监听。attributeOldValue被设置为true，因为我们希望在监听到值变化时可以获取到上一个值。

规范

规范	状态	说明
DOM MutationObserverInit: attributeFilter	Living Standard

浏览器兼容性

BCD tables only load in the browser

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.