Javascript Clock - часы пустые, несмотря на полную программу - PullRequest
Новая
       4

Javascript Clock - часы пустые, несмотря на полную программу

0 голосов
/ 11 октября 2019

Я пролил этот код и чувствую себя довольно позитивно. При этом очевидно, что чего-то не хватает, поскольку сама программа при запуске в браузере выдает пустые часы. Я знаю, что все скобки и скобки имеют соответствующий набор, и я довольно уверен в своих функциях. Инструменты разработчика Chrome были бесполезны. Любой, кто хорошо разбирается в Javascript, способен увидеть, чего здесь не хватает? 

"use strict";
var $ = function(id) {
  return document.getElementById(id);
};

var displayCurrentTime = function() {
  var today = new Date();
  var hour = today.getHours();
  var min = today.getMinutes();
  var sec today.getSeconds();

  var ap = "AM";

  if (hour > 12) {
    h = h - 12;
    ap = "PM";
  } else {
    switch (hour) {
      case 12:
        ap = "PM";
        break;
      case 0:
        ap = "AM";
        break;
    }
  }

  $("hours").firstChild.nodeValue = padSingleDigit(hours);
  $("minutes").firstChild.nodeValue = padSingleDigit(min);
  $("seconds").firstChild.nodeValue = padSingleDigit(sec);
  $("ap").firstChild.nodeValue = padSingleDigit(ap);
};


var padSingleDigit = function(num) {
  if (num < 10) {
    return "0" + num;
  } else {
    return num;
  }
};

window.onload = function() {
  displayCurrentTime();
  setInterval(displayCurrentTime, 1000);
};
<html>
    <head>
        <meta charset="UTF-8">	
        <title>Clock</title>
        <link rel="stylesheet" href="clock.css">
        <script src="clock.js"></script>
    </head>
    <body>
        <main>
            <h1>Digital clock</h1>
            <fieldset>
                <legend>Clock</legend>
                <span id="hours">&nbsp;</span>:
                <span id="minutes">&nbsp;</span>:
                <span id="seconds">&nbsp;</span>&nbsp;
                <span id="ampm">&nbsp;</span>
            </fieldset>
        </main>
    </body>
    </html>

1 Ответ

1 голос
/ 11 октября 2019

У вас просто много (3) опечаток ... 

"use strict";
var $ = function(id) {
  return document.getElementById(id);
};

var displayCurrentTime = function() {
  var today = new Date();
  var hour = today.getHours();
  var min = today.getMinutes();
  var sec = today.getSeconds();

  var ap = "AM";

  if (hour > 12) {
    hour = hour - 12;
    ap = "PM";
  } else {
    switch (hour) {
      case 12:
        ap = "PM";
        break;
      case 0:
        ap = "AM";
        break;
    }
  }

  $("hours").firstChild.nodeValue = padSingleDigit(hour);
  $("minutes").firstChild.nodeValue = padSingleDigit(min);
  $("seconds").firstChild.nodeValue = padSingleDigit(sec);
  $("ampm").firstChild.nodeValue = padSingleDigit(ap);
};


var padSingleDigit = function(num) {
  if (num < 10) {
    return "0" + num;
  } else {
    return num;
  }
};

window.onload = function() {
  displayCurrentTime();
  setInterval(displayCurrentTime, 1000);
};
<main>
  <h1>Digital clock</h1>
  <fieldset>
    <legend>Clock</legend>
    <span id="hours">&nbsp;</span>:
    <span id="minutes">&nbsp;</span>:
    <span id="seconds">&nbsp;</span>&nbsp;
    <span id="ampm">&nbsp;</span>
  </fieldset>
</main>

* есть другие (не функциональные) проблемы в этом коде, но, поскольку это не Q, я бы не стал их менять, чтобы сохранить этот ответна точку.

...