javascript - 使用 JavaScript 更改跨度的值

Question

我有一个跨度如下的 html:

<span class="className">0</span>它应该显示:0

问题是，我如何通过单击按钮并使用 javascript 来向范围添加一个值(例如，当值为 2 时，它将变为 3)。

Answer 1

您可以修改任意 HTMLElement 的内容使用:

• innerHTML

• textContent

看看这个片段:

document.addEventListener("DOMContentLoaded", function(){
   var button = document.querySelector("#mybutton");
   var span = document.querySelector(".className");
  
   button.onclick = function() {
     span.textContent= parseInt(span.textContent, 10) + 1;
   }
  
});

<span class="className">0</span>
<button id="mybutton">add</button>

编辑:如果您想使用onclick="" I don't recommend ，你可以这样做:

var myFunction = function() {
   var span = document.querySelector(".className");  
   span.textContent= parseInt(span.textContent, 10) + 1;  
}

<span class="className">0</span>
<button id="mybutton" onclick="myFunction()">add</button>