JavaScript事件偵聽非輸入元素

Question

可能重複：
Is there a jQuery DOM change listener?
How do can watch DOM Object properties?

是否有事件綁定到非輸入型元素的方法嗎？例如，將事件綁定到在更改href屬性時觸發的錨點元素。

Answer 1

您可以將處理程序綁定到非輸入元素上的各種事件（click,mousemove等）。但是當屬性發生變化時（例如鏈接上的href屬性示例），不會引發（一致的跨瀏覽器）事件。有些屬性（如src）會導致事件（如load）作爲次要事件，因爲bfavarello指出。

（有用於"mutation" events上的元素，包括屬性的變化[突變]一個現在已經死了建議，但它從來沒有得到廣泛支持。有一個newer proposal，但它也不是[尚未]廣泛支持。）

當然，您可以使用輪詢：保存舊值，然後定期（通過setTimeout或setInterval）查看它是否已更改。除非您正在檢查元件的批號，並且需要不斷檢查它們，否則這不一定是性能問題。

Answer 2

你可以一個DomSubtreeModified監聽器添加到的祖先，或者如果在您使用的瀏覽器支持，你可以在DOM對象的src財產使用watch。

myImage.watch("src",function(id, oldval, newval){ 
    document.write("src changed!"); 
    return newval;  
}); 

Answer 3

DOM Mutation Observers可以做到這一點，但他們是非常新的，並沒有很好的支持，在寫作時。

您是否正在編寫擴展或類似語言（即，您不控制修改DOM的代碼）？這是這些事件最常見的用例之一 - 你不控制改變DOM的代碼。我之前已經使用過在Chrome中運行良好的Mutation Summary。

如果您確實控制了修改DOM的代碼 - 即您正在自己的網站上修改該屬性 - 您可能希望在修改屬性時簡單地觸發自定義事件。