如何設置延遲

我有這行代碼：如何設置延遲

document.querySelector(".theclass").outerHTML = "The outerHTML";

而且它激發權當加載頁面時，然而這會導致「無法設置的未定義或爲空引用屬性」的錯誤。據我所知，這可能會發生，因爲.theclass還沒有，因此腳本無法定位它。

有沒有簡單的方法，使用JavaScript來簡單地爲這行代碼設置一個延遲，但它會自動繼續觸發，就像它在頁面加載時那樣？

來源

2016-04-07 yupowahe

將您'script'爲一體的''你 – Rayon

意味着在文檔的末尾'最後child'？是的，試過了。加載頁面後，會出現'.theclass'（它異步加載） – yupowahe

使用MutationObserver查看加載元素的時間，然後更新內容 –

嘗試使用

document.onload=function(){ 
    document.querySelector(".theclass").outerHTML = "The outerHTML"; 
};

編輯：的異步加載，你可以使用jQuery

$(document).on('DOMNodeInserted', function(e) { 
    if ($(e.target).is('.theclass')) { 
     document.querySelector(".theclass").outerHTML = "The outerHTML"; 
    } 
});

來源

2016-04-07 05:35:22

試過這個。 '.theclass'在頁面加載後出現（它異步加載） – yupowahe

@yupowahe編輯我的答案 –

一種選擇是使用一個MutationObserver來監聽元素的添加以及添加我們的目標元素我們可以更新它並刪除觀察者

setTimeout(function() { 
 
    document.getElementById('parentelement').innerHTML = '<span class="theclass">theclass</span>'; 
 
}, 500); 
 

 
// select the target node 
 
var target = document.querySelector('#parentelement'); 
 

 
// create an observer instance 
 
var observer = new MutationObserver(function(mutations) { 
 
    mutations.forEach(function(mutation) { 
 
    console.log(mutation.type, mutation); 
 
    Array.from(mutation.addedNodes).forEach(function(el) { 
 
     if (el.classList.contains('theclass')) { 
 
     el.outerHTML = "The outerHTML"; 
 
     observer.disconnect(); 
 
     } 
 
    }); 
 
    }); 
 
}); 
 

 
var config = { 
 
    childList: true 
 
}; 
 
observer.observe(target, config);

<div id="parentelement"></div>

來源

2016-04-07 06:05:58

如何設置延遲

回答

相關問題