DomNodeInserted
が推奨されていません。 MutationObserver
の唯一の例は、更新されている要素、追加されていない要素を示しています。domのクラス作成時
動的に作成される特定のクラスの新しい要素をリッスンするにはどうすればよいですか?
DomNodeInserted
が推奨されていません。 MutationObserver
の唯一の例は、更新されている要素、追加されていない要素を示しています。domのクラス作成時
動的に作成される特定のクラスの新しい要素をリッスンするにはどうすればよいですか?
あなたはすぐにクラスが追加されたとして、あなたがイベントをトリガすることを求めていることがある:
$(document).on('click', function(){
$('#theid').addClass('classname').trigger('classChange');
});
$('#theid').on('classChange', function() {
// do stuff
});
何か他のものは説明してください場合:
あなたが正しいMutationObserverInit
を渡すことによってこれを行うことができますMutationObserver
。あなたはtrue
にsubtree
を設定し、attributeFilter
追加する必要があります。ここに
// select the target node
var target = document.getElementById('some-id');
// create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log(mutation);
});
});
// configuration of the observer:
var config = { attributes: true, childList: false, characterData: false, subtree: true, attributeFilter: ['class']};
// pass in the target node, as well as the observer options
observer.observe(target, config);
var myElement = document.createElement('div');
myElement.innerHTML = 'foo';
target.appendChild(myElement);
//triggers the mutation observer
myElement.classList.add('bar');
JSFiddle:https://jsfiddle.net/7zwraaxz/3/
(DOMNODEのクラス名のように)class
を(https://hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/に基づいて)次の例を考えてみましょう
DOMノードを要素に追加すると、親権利の更新イベントがトリガされますか? ':)' –