如何检查 DOM 上的 JavaScript 执行历史

Question

<div class="box"></div>

// First script
$('.box').width(100);

// Second script
$('.box').addClass('color');

// Third script
$('.box').fadeOut();

结果：

<div class="color" style="width: 100px; display: none;"></div>

通过不同的js文件对一个DOM做某事可能会有所改变，如果脚本代码被分离到多个js文件中，很难找出div受到谁的影响，有没有工具可以检查执行DOM 的历史？

Answer 1

当然有，你只需要打开开发者工具（F12），打开网络部分激活它（如果没有激活，在IE中经常发生）并刷新你的站点，你会看到你的所有跟踪web 以及按调用顺序调用的每个文件。