偵測 DOM 變更
您可以使用各種方法來偵測文件物件模型 (DOM) 的變更。
1。 MutationObserver（現代瀏覽器）
const observer = new MutationObserver((mutations) => {
// Process mutations here...
});
observer.observe(targetElement, { childList: true, subtree: true });2.突變事件（已棄用，但仍支持）
targetElement.addEventListener('DOMNodeInserted', (event) => {
// Node added
});
targetElement.addEventListener('DOMNodeRemoved', (event) => {
// Node removed
});範例：偵測輸入新增
如果您特別想在
const targetElement = document.getElementById('element-to-monitor');
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
const addedNodes = mutation.addedNodes;
Array.from(addedNodes).forEach((node) => {
if (node.nodeName === 'DIV' || node.nodeName === 'INPUT') {
// Execute your function here...
}
});
}
});
});
observer.observe(targetElement, { childList: true, subtree: true });以上是如何在 JavaScript 中偵測並回應 DOM 變更？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
