Watching for DOM changes, the elegant way

前端 未结 2 1568
我在风中等你
我在风中等你 2020-12-13 09:21

I need to watch for an attribute change on any of the children of a specific DOM element. So far, I have been using mutation events.

The problem was - they were bugg

2条回答
  •  孤城傲影
    2020-12-13 09:35

    Would this work?

    http://darcyclarke.me/development/detect-attribute-changes-with-jquery/

    $.fn.watch = function(props, callback, timeout){
        if(!timeout)
            timeout = 10;
        return this.each(function(){
            var el      = $(this),
                func    = function(){ __check.call(this, el) },
                data    = { props:  props.split(","),
                            func:   callback,
                            vals:   [] };
            $.each(data.props, function(i) { data.vals[i] = el.css(data.props[i]); });
            el.data(data);
            if (typeof (this.onpropertychange) == "object"){
                el.bind("propertychange", callback);
            } else if ($.browser.mozilla){
                el.bind("DOMAttrModified", callback);
            } else {
                setInterval(func, timeout);
            }
        });
        function __check(el) {
            var data    = el.data(),
                changed = false,
                temp    = "";
            for(var i=0;i < data.props.length; i++) {
                temp = el.css(data.props[i]);
                if(data.vals[i] != temp){
                    data.vals[i] = temp;
                    changed = true;
                    break;
                }
            }
            if(changed && data.func) {
                data.func.call(el, data);
            }
        }
    }
    

提交回复
热议问题