javascript - 制作了有问题的图像点击计数器

Question

当我运行下面的代码时，每次点击它都会一次又一次地显示计数。我该如何优化它？

var i = 1;
var txt1;

$("#target").click(function(e) {
    console.log(i);
    i++;
    txt1 = $("<p></p>").text("count=" + i);
    $("body").append(txt1);
});

Answer 1

在正文中使用固定的 p 标签，并在每次点击时更新其文本内容。

var i = 0;
$("#target").click(function(e) {
  $("#p").text("count = " + ++i);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img id="target" alt="Click" src="">
<p id="p"></p>