Uncaught TypeError：無法讀取未定義屬性'innerHTML'，該怎麼辦？

Question

這是我的js代碼，在運行該項目之後，出現錯誤，提示 「Uncaught TypeError：無法讀取未定義的屬性'innerHTML'。

怎麼辦？

<code> 
$(document).ready(function() { 
var eventFired = function (type) { 
    var n = $('#demo_info')[0]; 
    n.innerHTML += '<div>'+type+' event - '+new Date().getTime()+'</div>'; 
    n.scrollTop = n.scrollHeight;  
}; 

$('#example') 
    .on('order.dt', function() { eventFired('Order'); }) 
    .on('search.dt', function() { eventFired('Search'); }) 
    .on('page.dt', function() { eventFired('Page'); }) 
    .dataTable(); 
}); 
</code> 

Answer 1

你在簡單的JS與jQuery混淆。 $('#demo_info')返回一個沒有在其上定義的innerHtml的jQuery對象。 innerHtml上定義的是由document.getElementById()或內置於JS中的其他類似函數返回的元素引用。

由於您使用的是jQuery，因此只需使用其html()方法，而不管怎樣，它都會在內部調用innerHtml。這應該是訣竅：

var old_html = n.html(); 
var new_html = '<div>' + type + ' event - ' + new Date().getTime() + '</div>'; 
n.html(old_html + new_html); 

希望這會有所幫助。