javascript - 使用 jQuery，是否可以观察 DOM 元素并在每次对其进行操作时进行报告？

Question

我正在处理一个包含令人困惑的异步效果链的网站。通常，效果会在停止之前相互执行/撤消几次。我很难理解意大利面条代码。

是否可以将回调设置为在操作 DOM 元素时运行，以便我可以跟踪代码应用于它的效果链？

编辑:我目前在各处添加了数十个 console.log，并且想要一种更简洁的方法。

Answer 1

一种方法是 Hook 到核心 jQuery 函数中并记录您想要的信息。这是我劫持的一些功能的一些非常粗略的代码，即隐藏和动画。

var log_for_functions = 'hide animate'.split(' '); 
$.each( log_for_functions , function(){ 
var function_name = this;
var original_function = $.fn[ original_function_name ]; // get a reference to old function name  

    $.fn[ function_name ] = function () {
        var r = original_function.apply(this, arguments); 
        console.log( function_name + ' called on element ', this );  
        return r;
    }

}); 

现在，如果您使用 jquery $('#test').hide() 隐藏元素，那么您将获得以下输出。

隐藏被调用的元素 [context: #test, selector: "#test"]

您可以更改它以满足您的需要，甚至可以连接到其他功能。