jQuery DOM元素被刪除，但子元素數仍然相同

Question

我有一個基本的jQuery腳本，檢測元素的刪除和計數其子元素。但子元素數不會改變，雖然元素被刪除。

這裏是我的HTML腳本

<div> 
    <p>Test 1</p> 
    <p>Test 2</p> 
    <p id="p3">Test 3</p> 
</div> 
<input type=submit value='Remove Test 3' id=submit-btn /> 

我的jQuery腳本

$('#submit-btn').click(function() 
    { 
     $('#p3').remove(); 
    }); 

    $("div").on('DOMNodeRemoved', function() { 
     //confirm the element removal 
     console.log("removed"); 

     //get child element count 
     console.log(this.childElementCount); 
    }); 

請參閱：https://jsfiddle.net/luan123z/zjaxgvad/4/

Answer 1

我會聽的DOMSubtreeModified事件來代替。用DOMNodeRemoved看來你需要有一些類型的延遲才能報告正確的計數。這裏有一個更新的小提琴：https://jsfiddle.net/zjaxgvad/5/