使用Javascript添加innerHTML

如何解决使用Javascript添加innerHTML

<div id="ones">
 <span class="dice">&#9856;</span>
 <p>-</p>
 </div>

我正在访问 id = ones 内部的此 p 标签。通过此JavaScript行。

var valueCount = 0;
    var valueCount = document.getElementById('ones').getElementsByTagName('p').textContent;
    valueCount++;
    document.getElementById('ones').getElementsByTagName('p').textContent = valueCount;

在控制台上，我得到 NaN 。我在哪里做错了？？

解决方法

不用document.getElementById来访问p或id属性的class标记。您可以使用document.querySelector但需要一个数字在段落中可以使用例如parseInt

转换为数字

const valueP = document.querySelector('#ones p');
var valueCount = parseInt(valueP.textContent);
valueCount++;
valueP.textContent = valueCount;

<div id="ones">
  <span class="dice">&#9856;</span>
  <p>0</p>
</div>

,

在您提供的代码中，我们可以看到您将valueCount定义为0，然后我们从p标记中获取文本数据，并将此值分配给valueCount，所以现在在valueCount中，我们有' -'字符串，然后我们尝试增加此错误值，所以现在valueCount是NaN，这就是问题所在

var valueCount = 0;
var valueCount = document.getElementById('ones').getElementsByTagName('p').textContent;
valueCount++;
document.getElementById('ones').getElementsByTagName('p').textContent = valueCount;