爲什麼這行Javascript的工作，但其他不？

Question

所以我試圖更新div #letters的內容。我嘗試將元素分配給一個變量並使用innerHTML更新其內容，但它不起作用。

var $characterArray = $('#letters'); // The letters div 
    $characterArray.innerHTML = "whatever"; 

雖然這個工程：

document.getElementById("letters").innerHTML = "whatever"; 

能否請你告訴我，爲什麼？

Answer 1

因爲你用原生JS混淆了jQuery。 jQuery對象沒有這樣的屬性innerHTML - 這是一個本地屬性。

jQuery中等效爲具有用於設置元件的內HTML內容不同的方法名稱的方法html()

$('something').html('my html'); 

Answer 2

第一代碼段使用jQuery庫（未香草JS）。 jQuery的正確用法是：

var $characterArray = $('#letters'); // The letters div 
$characterArray.html('whatever'); 

Answer 3

第一行不是vanilla Javascript。它需要名爲jQuery的JavaScript框架。

如果你喜歡依靠jQuery和你included it在你的頁面，那麼你可以使用html()：

$("#letters").html("whatever"); 

附：我認爲你不知道jQuery，因爲jQuery-tag是added later，通過@DarrenSweeney。

Answer 4

如果你真的想要的代碼對你可以使用索引來得到它本機的HTML元素：

var $characterArray = $('#letters')[0]; // The letters div 
$characterArray.innerHTML = "whatever";