3

我需要监控一个元素的显示状态。我正在使用以下代码

if WebKitMutationObserver?
    observer = new WebKitMutationObserver observerFunc
    observer.observe el, {attributes:true}
  else
    el.addEventListener "DOMAttrModified",(event)->
      wrapper.style.display = el.style.display
      return

但是，这在 Safari 中不起作用。

此外，在 Chrome 的开发人员工具即时窗口中键入“WebKitMutationObserver”会给出输出

function WebKitMutationObserver() { [native code] }

在 Safari (v 5.1.7) 中，这会给出错误消息“找不到变量：WebKitMutationObserver”

难道是 Safari 不支持 WebkitMutationObserver？如果是这样，有没有我可以使用的替代方案？

4

1 回答 1

0

最新的 Safari (6.0) 确实包括WebKitMutationObserver. 对于较旧的 Safari，以下是我们使用的一些代码，DOMAttrModified当您使用setAttribute或removeAttribute更改属性时会伪造事件。请注意，如果浏览器本身在内部更改属性，这将不起作用。

  var win = window;
  var doc = win.document;
  var attrModifiedWorks = false;
  var listener = function () { attrModifiedWorks = true; };
  doc.documentElement.addEventListener("DOMAttrModified", listener, false);
  doc.documentElement.setAttribute("___TEST___", true);
  doc.documentElement.removeAttribute("___TEST___", true);
  doc.documentElement.removeEventListener("DOMAttrModified", listener, false);
  if (!attrModifiedWorks)
  {
    This.DOMAttrModifiedUnsupported = true;

    win.HTMLElement.prototype.__setAttribute = win.HTMLElement.prototype.setAttribute;
    win.HTMLElement.prototype.setAttribute = function fixDOMAttrModifiedSetAttr (attrName, newVal)
    {
      var prevVal = this.getAttribute(attrName);
      this.__setAttribute(attrName, newVal);
      newVal = this.getAttribute(attrName);
      if (newVal != prevVal)
      {
        var evt = doc.createEvent("MutationEvent");
        evt.initMutationEvent
          ( "DOMAttrModified"
          , true
          , false
          , this
          , prevVal || ""
          , newVal || ""
          , attrName
          , (prevVal == null) ? win.MutationEvent.ADDITION : win.MutationEvent.MODIFICATION
          );
        this.dispatchEvent(evt);
      }
    }

    win.HTMLElement.prototype.__removeAttribute = win.HTMLElement.prototype.removeAttribute;
    win.HTMLElement.prototype.removeAttribute = function fixDOMAttrModifiedRemoveAttr (attrName)
    {
      var prevVal = this.getAttribute(attrName);
      this.__removeAttribute(attrName);
      var evt = doc.createEvent("MutationEvent");
      evt.initMutationEvent("DOMAttrModified", true, false, this, prevVal, "", attrName, win.MutationEvent.REMOVAL);
      this.dispatchEvent(evt);
    }
  }
}
于 2012-08-03T08:43:07.353 回答