Javascript 向DOM元素jquery添加数字的最有效/最快速的方法

我正在学习jQuery的基础知识，并测试我所知道的，我尝试在存储数字的DOM元素（

）的文本中添加1。

中的数字成功地增加了1，但是我觉得我更新元素的方式不是最好的方式，因为我似乎需要调用相同的jQuery函数两次（参见下面的代码）

有谁能建议更好的做法吗

HTML

---

谢谢：-）

首先要避免使用内联事件处理程序。一旦设置了事件处理程序，就可以通过

this

引用元素：

$('button').click(function() {
  $(this).find('span').text( parseInt($(this).find('span').text()) + 1 );
})

---

您这样做的方式还可以，但我会尽量避免将状态存储在文本节点中

我建议有两种方法

0喜欢这个

函数handleClick（）{
var$this=$（this）；
var count=$this.data（'count'）；
//更新状态
$this.data（'count'，count+1）；
//更新视图
$this.find（'a'）.text（计数+1）；
}

---

是的，您不必使用内联处理程序也是如此。

因为按钮中只有一个元素（即：span），所以我建议使用不同的方法而不使用jQuery。缺点：

• 内联事件处理程序
• 我想只有一个孩子

函数foo（ele）{
ele.children[0].textContent=parseInt（ele.textContent）+1；
}

0喜欢这个

谢谢。为什么要避免使用内联事件处理程序？@koder613很高兴你这么问。请看，我对jQuery很陌生，很抱歉我的无知，但是“在文本节点中存储状态”是什么意思？谢谢。@koder613嘿！我在

0

中引用了这个0。以这种方式存储值会使读取和修改值稍微困难一些。通常建议在JS代码中保持这种状态。感谢您的解释。同样在代码中，

$this=$（this）

行的用途是什么。这仅仅是为了缩短对$（this）的引用两个字符吗？@koder613:）如果您喜欢

$（this）

，请随意删除它。我只是习惯于在函数请求中存储对所有内容的引用。正如您所提到的，我不希望使用内联事件handlersThaks来帮助您。

function foo(elementId){
    $('#' + elementId).text(parseInt($('#' + elementId).text()) + 1);
}

$('button').click(function() {
  $(this).find('span').text( parseInt($(this).find('span').text()) + 1 );
})