admin管理员组

文章数量:1399944

html below

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8"/>
    <title>Stopwatch</title>
  </head>
  <body>
    <p><span id="seconds">00</span><span>:</span><span id ="tens">00</span></p>
    <button id="start">Start</button>
    <button id="stop">Stop</button>
    <button id="reset">Reset</button>
    <script src="main.js"></script>
  </body>
</html>

javascript below 

window.onload = function () {
  var seconds = 0
  var tens = 0
  var getTens = document.getElementById('tens')
  var getSeconds = document.getElementById('seconds')
  var start = document.getElementById('Start')
  var stop = document.getElementById('Stop')
  var reset = document.getElementById('Reset')
  var interval
  start.onclick = function () {
    clearInterval(interval)
    interval = setInterval(startTimer, 10)
  }

  stop.onclick = function () {
    clearInterval(interval)
  }

  reset.onclick = function () {
    clearInterval(interval)
    tens = '00'
    seconds = '00'
    getTens.innerHTML = tens
    getSeconds.innerHTML = seconds
  }

  function startTimer() {
    tens++
    if (tens < 9) {
      getSeconds.innerHTML = '0' + tens
    }
    if (tens > 9) {
      getTens.innerHTML = tens
    }
    if (tens > 99) {
      console.log('seconds')
      seconds++
      getSeconds.innerHTML = '0' + seconds
      tens = 0
      getTens.innerHTML = '0' + 0
    }
    if (seconds > 9) {
      getSeconds.innerHTML = seconds
    }
  }
}

I am getting this (main.js:11 Uncaught TypeError: Cannot set property 'onclick' of null at window.onload) error in console and cannot figure out why. I have tried multiple other solutions including moving the tag in the HTML as I have seen that helped others however I cannot get it.

html below

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8"/>
    <title>Stopwatch</title>
  </head>
  <body>
    <p><span id="seconds">00</span><span>:</span><span id ="tens">00</span></p>
    <button id="start">Start</button>
    <button id="stop">Stop</button>
    <button id="reset">Reset</button>
    <script src="main.js"></script>
  </body>
</html>

javascript below 

window.onload = function () {
  var seconds = 0
  var tens = 0
  var getTens = document.getElementById('tens')
  var getSeconds = document.getElementById('seconds')
  var start = document.getElementById('Start')
  var stop = document.getElementById('Stop')
  var reset = document.getElementById('Reset')
  var interval
  start.onclick = function () {
    clearInterval(interval)
    interval = setInterval(startTimer, 10)
  }

  stop.onclick = function () {
    clearInterval(interval)
  }

  reset.onclick = function () {
    clearInterval(interval)
    tens = '00'
    seconds = '00'
    getTens.innerHTML = tens
    getSeconds.innerHTML = seconds
  }

  function startTimer() {
    tens++
    if (tens < 9) {
      getSeconds.innerHTML = '0' + tens
    }
    if (tens > 9) {
      getTens.innerHTML = tens
    }
    if (tens > 99) {
      console.log('seconds')
      seconds++
      getSeconds.innerHTML = '0' + seconds
      tens = 0
      getTens.innerHTML = '0' + 0
    }
    if (seconds > 9) {
      getSeconds.innerHTML = seconds
    }
  }
}

I am getting this (main.js:11 Uncaught TypeError: Cannot set property 'onclick' of null at window.onload) error in console and cannot figure out why. I have tried multiple other solutions including moving the tag in the HTML as I have seen that helped others however I cannot get it.

  • javascript
  • html
Share Improve this question asked Feb 27, 2018 at 7:06 KschulteKschulte 231 gold badge1 silver badge3 bronze badges 1
  • That gives me an ESLint error in atom and still the same error in console. @gurvinder372 – Kschulte Commented Feb 27, 2018 at 7:09
Add a ment  | 

2 Answers 2

Reset to default 4

ids are case sensitive. So you element is #stop and not #Stop

  var stop = document.getElementById('stop')

Just make sure to do this for all the elements.

Check the case of id. You write id="start" in html but document.getElementById('Start') in js.

本文标签： javascriptTypeError Cannot Set property 39onclick39 of nullStack Overflow

版权声明：本文标题：javascript - TypeError: Cannot Set property &#39;onclick&#39; of null - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744192771a2594596.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。