设置$（“＃x”）。innerHTML不会更改元素

Question

我正在尝试设置H2元素的值，但值永远不会改变。当我点击我的网页上的字母（a，b，c等）时，我尝试更新H2值，如下所示：

function GetEntries(firstLetter) {
    $('#letterChosen').innerHTML = firstLetter;
}

这是H2元素。

<h2 id="letterChosen" class="results">Results</h2>

我尝试过一些东西，而innerHTML属性是我最后的尝试。知道我做错了什么吗？注意，参数firstLetter实际上有一个值，所以这不是问题。

Answer 1

试试这个：

document.getElementById('letterChosen').innerHTML = firstLetter;

或者更好：

document.getElementById('letterChosen').firstChild.nodeValue = firstLetter;

---

通过使用jQuery的$('#letterChosen')，您将获得一个jQuery对象，而不是元素本身。您可以通过在末尾添加[0]来访问该元素（所以$('#letterChosen')[0]），但在这种情况下，当有一个非常好的原生方法时，使用jQuery实际上有点愚蠢。

Answer 2

因为innerHTML不是jQuery方法。它实际上是原生的。试试.html()

$('#letterChosen').html(firstLetter);