为什么 MutationObserver 不适用于 FullCalendar 中的标题更改？

Question

我需要知道 FullCalendar 的当前标题。单击导航按钮后可以更改标题。

我没有找到任何 FullCalendar 本地方法来获取标题，所以我正在寻找其他方法来找出答案。我认为 MutationObserver 会起作用..但是通过按钮更改文本时它不起作用。如果更改是通过 JavaScript 完成的

 var Calendar = FullCalendar.Calendar;
 var calendarEl = document.getElementById('calendar');
 
 calendar = new Calendar(calendarEl, {
         
 })
   
 calendar.render()
   
 //More Details https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
 // select the target node
//var target = document.getElementsByClassName('ffc-toolbar-title')[0]
var target = document.getElementsByClassName('fc-toolbar-title')[0]
//var target = document.getElementById('1')
  console.log(target.innerText);  


// create an observer instance
//var observer = new WebKitMutationObserver(function(mutations) {
var observer = new MutationObserver(function(mutations) {
  console.log(target.innerText);   
  console.log("comming from obeserver")
});
// 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);

setInterval(function(){
  //  target.innerText = ('hello world ' + Math.random() + '!!!');
},1000); 

然后 MutationObserver 工作。

知道如何解决这个问题吗？工作jsFiddle

Answer 1

我可以通过将subtree: true 添加到config 来观察点击月份递增/递减按钮所产生的变化。

来自MDN's page on "MutationObserver.characterData"：

请注意，这不会监控 HTMLElement 的内容，即使它只包含内部文本，因为它只监控文本节点本身。因此，要么直接将文本节点传递给 observe() 方法，要么还需要设置 subtree: true。