javascript - jquery，实时 "title"属性变化

Question

我有一个跨度，每秒在工具提示中显示来自服务器的一些数据:

<span class="bata hastip" title="{will change}"></span>

我正在使用 tooltipsy显示工具提示的插件:

$('.hastip').tooltipsy({
        offset: [-10, 0],
        css: {
            'background-color': '#444F54',
            'border': '1px solid #888'
        }
})

由于我的数据每隔几秒就会发生变化，我如何检测该变化？像这样:

$('.bata').prop('title', datas);
//$('.bata').attr('title', datas) same...

$(document).on('change', '.bata', function(){
   //this method doesn't work
});

Answer 1

“您指的是 DOM Mutation Events。浏览器对这些事件的支持很差(但正在改进)。jQuery 的 Mutation Events 插件可能会为您提供一些帮助。”

查看此相关问题:firing event on DOM attribute change

快捷方式 - 检查这个:)

https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

支持很好，除了 IE11+

来自 MDN 的示例用法:

// select the target node
var target = document.querySelector('#some-id');

// create an observer instance
var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    console.log(mutation.type);
  });    
});

// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true };

// pass in the target node, as well as the observer options
observer.observe(target, config);

// later, you can stop observing
observer.disconnect();