您如何知道dom節點何時添加到文檔中？

Question

將dom節點添加到文檔時，有什么好方法可以引起警報？ 如果要在javascript中將dom節點放在一起，通常先將它們放在一起，然后再進行，這樣就不會一直在進行重排。 但這意味着添加元素時，它們在頁面上不可見，這意味着有關它們的某些信息不可訪問/錯誤。 例如， offsetWidth在添加到文檔流中之前將為0，而不管其添加后的寬度如何。

因此，理想情況下，我希望有一種在將節點添加到文檔時獲取事件的方法，這樣我就可以執行需要offsetWidth以及需要呈現它的其他操作。

Answer 1

在大多數情況下，使用變異觀察者來觀察document應該是一種合理的工具（如果您要設置旨在長時間監聽的監聽器，則可能不合理）：

        var observer = new MutationObserver(function(mutations) {
            mutations.forEach(function(mutation) {
                if(mutation.target.contains(block.domNode)) {
                    // do your thing, then..
                    observer.disconnect()
                }
            })
        })
        observer2.observe(document, {childList: true, subtree: true})

請注意，如果將dom節點從文檔中刪除，然后重新插入，則上面的代碼將無法捕獲（但可以對其進行修改）。