使用javascript函数更改span标记内的数字时遇到问题

编辑：谢谢！它现在工作得很好。我真的很感谢你的快速回复

相关的jfiddle

我有一个跨度列表，每个跨度都有唯一的ID，我希望能够使用href或input修改这些跨度。我现在只在做一个，试图让它工作，但似乎没有任何进展。相关的html是：

    <ul>
    <li>STR <span id="str">0</span></li>
<br>
<input type='button' onClick="abilUp()" value='increase by 1' />

按钮起作用，函数在控制台中返回增加值，但范围内的实际值不变。我很确定它不会将0识别为数字，因此我尝试使用以下方法：

+document.getElementById('str');
Number(document.getElementById('str'));
parseInt(document.getElementById('str'), 10);

我还尝试过在innerHTML中使用一个变量，但它不起作用。我知道这是可能的，我只是不知道我做错了什么。提前感谢您提供的任何帮助

---

编辑以修复parseInt示例的问题是，您获取的是变量aV中的元素，而不是值。因此，您必须获取该元素中的内容并对其执行操作

试试这个

var statVal = 1;
function abilUp() {
    var aV = document.getElementById('str');
    aV.textContent = (+aV.textContent) + statVal;
    console.log("str ="+ aV.textContent);
}

---

您需要使用innerHTML获取div的实际文本：

var statVal = 1;
function abilUp() {
    var aV = +document.getElementById('str').innerHTML;
    aV = aV + statVal;
    document.getElementById('str').innerHTML= aV;
}

使用innerHTML获取数字， 然后使用parseInt将字符串更改为数字 并返回带有数字的内部HTML

这是小提琴手

var statVal = 1;
function abilUp() {
    var aV = +document.getElementById('str').innerHTML;
    aV = aV + statVal;
    document.getElementById('str').innerHTML= aV;
}

function abilUp() {
    var aV = document.getElementById('str').innerHTML;
    var aV = parseInt(aV);
    document.getElementById('str').innerHTML = aV+1;
}