我已经阅读了很多问题，大多数问题似乎都指向 JQuery，但实际上我正在尝试仅使用普通 JS 来完成此工作。我试图让图片下方的屏幕编号随着每次点击而增加 1。我实际上得到了 NaN，现在当我点击时出现了一个奇怪的“[objectParagraphElement]1”消息，所以我知道 DOM 受到了影响。有人能看到我在做的蠢事吗？
谢谢
<!DOCTYPE html>
<html lang=en>
<head>
<title>KittyKlikr</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<!--<p id="kitty"></p>-->
<span id="kitty1"><img src="kittyklikr.jpg" alt="kitty" height="50%" width="50%"></span>
<br>
<p id="counter">0</p>
<script>
document.addEventListener("click", addUp, false);
function addUp() {
var x = document.getElementById("counter");
document.getElementById("counter").innerHTML = x+1;
}
</script>
</body>
</html>
最佳答案
假设你有:
var x = document.getElementById("counter");
并且innerHTML属性返回一个字符串，您需要将值转换为数字，加1，然后写回元素:
x.innerHTML = parseInt(x.innerHTML) + 1;
或者您可以使用unary + operator :
x.innerHTML = +x.innerHTML + 1;
但是parseInt可能会更清楚。
编辑
顺便说一句，一种更简洁的方法是将值存储为数字并将其写入元素，例如:
// Use an IIFE to hold count and reference to element in a closure
var addUp = (function() {
var count = 0;
return function () {
var element = document.getElementById("counter");
if (element) element.innerHTML = ++count;
}
}());
// Attach as a listener
document.addEventListener("click", addUp, false);
请注意，由于使用了函数表达式，因此在表达式执行之前您无法将其指定为监听器。
关于javascript - Javascript 中的点击事件计数器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28378375/