Question

每次点击都会添加5到0的脚本。因此，如果我点击它一次它会给我5，两次10，三次15等等。

function add5() {
  var originalNumber = 0
  var add5 = 5
  var el = document.getElementById('number');
  el.textContent = originalNumber + add5;
}
var el = document.getElementById('number');
el.textContent = originalNumber;

Answer 1

您必须将原始号码指定给旧号码你有很多方法可以做到这一点

1-

el.textContent = originalNumber = originalNumber + add5;

2 -

el.textContent = 0;
el.textContent += add5;

Answer 2

每次点击获取元素中的值并向其中添加5。

这意味着更改此行

df[,1]>=0 & df[,2]>=0

到此

el.textContent = originalNumber + add5;

注意：，因为您将该数字作为文本内容获取，它将采用字符串格式。要进行任何数学运算，最好将任何字符串格式数转换为实际数。因此我使用el.textContent = parseInt(el.textContent ,10)+ add5;将文本编号转换为整数

此外，您可以删除该功能中的行parseInt。进行上述更改后，它无效

Answer 3

请检查一下，它可能对您有帮助。

originalNumber = 0
function add_5() {
	 var el = document.getElementById('number');
    originalNumber = parseInt(el.textContent);
    var add5 = 5 
el.textContent = originalNumber + add5;
}
var el = document.getElementById('number');
el.textContent = originalNumber ;

<div id="number" onclick="return add_5();" ></div>

Answer 4

你可以这样得到： -

    <!DOCTYPE html>
    <html>
    <head>
      <title></title>
    </head>
     <body>
      <button id="add" onclick="add5()">Add 5</button>
      <span id="output">Output: 0</span>
     <script type="text/javascript">
      var sum = 0;
      function add5(){
        sum += 5;
        document.getElementById('output').innerHTML = 'Output: '+sum;
      }
     </script>
   </body>
  </html>

现在，每当您点击按钮时，它会向您的输出添加5。

Answer 5

它只会在初始化为0的原始变量中添加5，在将使用onClick事件调用的函数内

＆＃13;

var originalNumber =0;
function add5() {
  var el = document.getElementById('number');
  el.textContent= originalNumber+=5;
}

＆＃13;

#number{
      width: 30px;
      height: 20px;
      background: #ca2;
    }

＆＃13;

<div id="number" onclick="return add5();"></div>

＆＃13;

Answer 6

我认为以下内容是实现您想要的相当不错的方式。

<强> HTML

<div id="number">0</div>

<强> JS

var numberElement = document.getElementById('number');
numberElement.addEventListener('click',function(event){ // Add an event handler to numberElement 
    var el = event.target; // Find out which element was clicked
    originalNumber = parseInt(el.textContent); // Parse string into a number (use parseFloat if you want to handle decimals)
  el.textContent = originalNumber + 5 // Update the textContent of the element
});

注意：为什么要解析textContent，它会返回一个字符串，以便在textContent的{{1}}设置为div时确保预期的行为} - "05"不是预期的10

Answer 7

这里你不需要单独的方法。一种方法（使用es6和css显示值）：

＆＃13;

"use strict";
(() => {
  const report = document.querySelector('[data-value]');
  document.querySelector('#add5')
    .addEventListener(
      'click',
      () => report.setAttribute('data-value', +report.getAttribute('data-value') + 5)
      //                                      ^convert value to Number
  );
})();

＆＃13;

[data-value]:after {
  content: attr(data-value);
  color: red;
  font-weight: bold;
}

＆＃13;

<div id="number">
  your value now: <span data-value="0"></span> 
  <button id="add5">Add 5</button>
</div>

＆＃13;

我该如何编写这个数学脚本？

7 个答案: