{"id":286,"date":"2025-09-04T08:21:08","date_gmt":"2025-09-04T08:21:08","guid":{"rendered":"https:\/\/mitalgoswami.in\/?p=286"},"modified":"2025-09-04T08:21:08","modified_gmt":"2025-09-04T08:21:08","slug":"how-to-design-digital-clock-using-javascript","status":"publish","type":"post","link":"https:\/\/mitalgoswami.in\/?p=286","title":{"rendered":"How to Design Digital Clock using JavaScript?"},"content":{"rendered":"\n<p><strong>style.css<\/strong><\/p>\n\n\n\n<h1 class=\"wp-block-heading\">clock {<\/h1>\n\n\n\n<pre class=\"wp-block-code\"><code>font-size: 175px;\nwidth: 900px;\nmargin: 200px;\ntext-align: center;\nborder: 2px solid black;\nborder-radius: 20px;<\/code><\/pre>\n\n\n\n<p>}<\/p>\n\n\n\n<p><strong>index.html<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;html>\n&lt;head>\n    &lt;link rel=\"stylesheet\" href=\"style.css\">\n&lt;\/head>\n&lt;body>\n    &lt;div id=\"clock\">8:10:45&lt;\/div>\n    &lt;script>\n        \nsetInterval(showTime, 1000);\nfunction showTime() {\n    let time = new Date();\n    let hour = time.getHours();\n    let min = time.getMinutes();\n    let sec = time.getSeconds();\n    am_pm = \"AM\";\n\n    \/\/ Setting time for 12 Hrs format\n    if (hour >= 12) {\n        if (hour > 12) hour -= 12;\n        am_pm = \"PM\";\n    } else if (hour == 0) {\n        hr = 12;\n        am_pm = \"AM\";\n    }\n\n    hour =\n        hour &lt; 10 ? \"0\" + hour : hour;\n    min = min &lt; 10 ? \"0\" + min : min;\n    sec = sec &lt; 10 ? \"0\" + sec : sec;\n\n    let currentTime =\n        hour +\n        \":\" +\n        min +\n        \":\" +\n        sec +\n        am_pm;\n\n    \/\/ Displaying the time\n    document.getElementById(\n        \"clock\"\n    ).innerHTML = currentTime;\n}\n\nshowTime();\n\n    &lt;\/script>\n&lt;\/body>\n\n&lt;\/html><\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>style.css clock { } index.html<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-286","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=\/wp\/v2\/posts\/286","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=286"}],"version-history":[{"count":1,"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=\/wp\/v2\/posts\/286\/revisions"}],"predecessor-version":[{"id":287,"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=\/wp\/v2\/posts\/286\/revisions\/287"}],"wp:attachment":[{"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=286"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=286"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mitalgoswami.in\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=286"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}