我有一个骨干驱动的播放器，可以在任何给定时间播放歌曲列表，并固定在页面底部。我还有几个页面（使用Backbone Router工作）包含专辑和歌曲，因此用户可以点击任何内容的“播放”，播放器开始播放所选专辑或歌曲。
即使用户导航到其他网页或搜索某些内容（例如，结果中的某个专辑是当前正在播放的专辑），我想在该专辑或歌曲上显示当前播放的内容。
现在，我已经添加了一个关于玩家进度的回调，它每秒搜索$('.album[data-id="..."])并添加适当的类等等。问题是这是资源密集型的，需要大量的时间和CPU功率（css选择器很慢）。
有没有办法在应用中监听每次 dom更改并在这些更改上运行脚本而不是歌曲进度？
感谢。
答案 0 :(得分：1)
您需要一个可以收听的活动。每次加载专辑时会触发的东西。如果没有，请添加$.trigger()
/*in the code that loads the album elements*/
$(this).trigger( "albumloaded", dataID ); // second argument optional
然后使用jQuery委托$.on()
将侦听器附加到根元素并添加选择器以使其委派：
$(".rootselector").on("albumloaded",".selector",function(e,dataID){/*handler*/});
这将触发每个已加载的事件，其中元素与.selector参数匹配。
答案 1 :(得分：0)
您可以简单地使用最近在现代网络浏览器中介绍的Mutation events。
例如，如果您想在将兄弟添加到特定元素后执行操作：
element.addEventListener("DOMNodeInserted", function (ev) {
// ...
}, false);
此外，还有更多事件可让您检测其他更改：
阅读详情：https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Mutation_events
虽然这些事件的性能取决于浏览器的版本（例如，Google Chrome在这类事件中看起来要快得多）以及客户端资源，例如： CPU。