D4mations.com

Beginner JavaScript Tutorial – 37 – Date Objects



Facebook – https://www.facebook.com/TheNewBoston-464114846956315/
GitHub – https://github.com/buckyroberts
Google+ – https://plus.google.com/+BuckyRoberts
LinkedIn – https://www.linkedin.com/in/buckyroberts
reddit – https://www.reddit.com/r/thenewboston/
Support – https://www.patreon.com/thenewboston
thenewboston – https://thenewboston.com/
Twitter – https://twitter.com/bucky_roberts

Original source

d4mer

, , , , , , , , , , , , , , , , ,

49 responses to “Beginner JavaScript Tutorial – 37 – Date Objects”

  1. Why doesnt this work?

    function something(){
    var date = new Date();
    var h = date.getHours();
    var m = date.getMinutes();
    var s = date.getSeconds();

    document.write(h + ":" + m + ":" + s)

    }
    setInterval("something()", 1000);

  2. <script>
    function printTime() {
    var now = new Date();
    var hours = now.getHours();
    var mins = now.getMinutes();
    var seconds = now.getSeconds();
    document.write(hours+":"+mins+":"+seconds+"</br>");

    }
    SetInterval("printTime()" , 1000);

    </script>

    this my code but the output will showing white blank page. how to solve this problem??

  5. Hey what's my problem here? chrome don't shows me nothing: what i missing

    <!doctype html>
    <html>
    <head>

    </head>
    <body>

    <script type="text/javascript">
    function printTime(){
    var now = new Date();
    var hours = now.getHours();
    var mins = now.getMinutes();
    var seconds = now.getSeconds();

    document.write(hours+":"+mins+":"+seconds+"<br />");

    }

    setInterval("printTime()", 1000);
    </script>

    </body>

    </html>

  13. I still don't get why would you need to make variables for hours, mis and secs. Could someone explain it to me? Is it for making it more readable?
    This is my version:
    <html>
    <head>
    </head>
    <body>
    <script type="text/javascript">
    function printTime() {
    var h = new Date();
    document.write(h.getHours() + ":" + h.getMinutes() + ":" + h.getSeconds() + "<br />");
    }
    setInterval("printTime()", 1000);
    </script>
    </body>
    </html>

  18. <html>
    <head>
    <title>DATE</title>
    </head>
    <body>
    <script type="text/javascript">
    function curTime(){
    var timer = new Date();
    var hour = timer.getHours();
    var mins = timer.getMinutes();
    var secs = timer.getSeconds();

    document.write(hour+" : "+mins+" : "+secs+"<br/>");
    }
    setInterval("curTime()",1000);

    </script>

    </body>
    </html>

    This isn't working. Can anyone help? It's giving 404 error…..

  19. my version of clock program with AM PM, Thanks for the tutorials bucky 🙂

    <!DOCTYPE html>
    <html>
    <body>

    <p id="demo"></p>

    <script>
    function myClock() {
    var timeNow = new Date();
    var hours = timeNow.getHours();
    var minutes = timeNow.getMinutes();
    var seconds = timeNow.getSeconds();
    var outputDate = "";

    if (hours > 12) {
    hours = hours – 12;
    outputDate = hours + ":" + minutes + ":" + seconds + " pm";
    } else {
    outputDate = hours + ":" + minutes + ":" + seconds + " am";
    }

    document.getElementById("demo").innerHTML = outputDate;
    }
    setInterval("myClock()", 1000);
    </script>

    </body>
    </html>

  26. As others have rightly pointed out, this code WILL NOT function as described in Firefox or IE. Chrome is allowing this to run, which is a problem with Chrome's implementation of JS. This code, as written, should fail in every browser. The fact that Chrome is allowing it is just another reason not to use Chrome.

    FF and IE will not allow document.write() to be called from setInterval() more than once. This is done to prevent certain security issues resulting from malicious code. Change the document.write() line to the following:

    document.body.innerHTML += hours+":"+minutes+":"+seconds+"<br />";

    This change will fix the code for all browsers. Here is my complete HTML5 code, which works in FF and IE:

    <!DOCTYPE html>

    <html>
    <head>
    <title>My Page</title>
    <meta charset="UTF-8">
    </head>

    <body>
    <script type="text/javascript">
    function printTime() {
    var now = new Date();
    var hours = now.getHours();
    var minutes = now.getMinutes();
    var seconds = now.getSeconds();
    document.body.innerHTML += hours+":"+minutes+":"+seconds+"<br>";
    }
    setInterval("printTime()", 1000);
    </script>
    </body>
    </html>

  28. I was trying to display Greeting according to Hours but it don't work… Help me please..
    <html>
    <head>
    <title>Date Object</title>
    </head>
    <body>
    <script type="text/javascript">
    var now = new Date();
    var hours = now.getHours();
    if(hours<12)
    {
    document.write("Good Morning");
    }
    </script>
    </body>
    </html>

  30. took me some time , but i did it yeeey , thank you bucky!

    <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    </head>
    <body><div id ='display'></div>
    <script type="text/javascript">

    function amPm(){
    var now = new Date();
    var hours = now.getHours();
    if(hours > 12){
    return " pm";
    }else{
    return " am";
    }
    }

    function printTime(){
    var now = new Date();
    var mins = now.getMinutes();
    var hours = now.getHours();
    var second = now.getSeconds();
    document.getElementById("display").innerHTML =hours + amPm() + " : " + mins + " : " + second;
    }
    setInterval("printTime()",1000);

    </script>
    </body>
    </html>

  32. In FF and IE I only get the initial time but nothing thereafter. In Chrome I get a time listing ever second.

    <script>
    function printTime(){
    var now = new Date();
    var hours = now.getHours();
    var mins = now.getMinutes():
    var seconds = now.getSeconds();
    document.wwrite(hours+":"+mins+":"+seconds+"<br />");
    }

    setInterval("printTime()", 1000);
    </script>

  33. this is my 12 hours clock with AM and PM

    <div id='displayer'></div>
    <script>
    function clock(){
    now = new Date();
    hour = now.getHours();
    min = now.getMinutes();
    sec = now.getSeconds();
    ampm = 'AM';
    offset = 12;
    if(hour>12){
    ampm = 'PM';
    }
    if(sec<10){
    sec = '0' + sec;
    }
    if(min<10){
    min = '0' + min;
    }
    if(hour>12){
    hour = hour – offset;
    }
    if(hour<10){
    hour = '0' + hour;
    }
    document.getElementById('displayer').innerHTML=hour + ':' + min + ':' + sec + ' ' + ampm;
    }
    clock();
    setInterval("clock()",1000);
    </script>

  34. Thanks bucky! I changed the code a bit to make a more legit clock:

    <div id="time"></div>

    <script type="text/javascript">

    function time(){
    var now = new Date();
    var hour = now.getHours();
    var min = now.getMinutes();
    var sec = now.getSeconds();
    document.getElementById("time").innerHTML= hour+":"+min+":"+sec;
    }

    setInterval("time()", 1000);

    </script>

  38. <html>
    <head> 
    <script type="text/javascript">
    </script> 
    </head>
    <body>

    <script type="text/javascript">
    function hello(){
    ducument.write("hello");
    }
    setInterval("hello()", 1000);
    </script>
    </body>

    </html>

    what is the error in it… i m not able to excute it.

  39. How I did it:

    var now = new Date();
    var s = now.getSeconds();
    var m = now.getMinutes();
    var h = now.getHours();

    function fdsa(){
    plus();

    function plus(){
    s++;
    }

    if(s==60){
    s = 0;
    m++;
    }

    if(m==60){
    m = 0;
    h++;
    }

    document.write(h + ":" + m + ":" + s + "<br/>");
    }

    setInterval("fdsa()", 1000);

  41. <!– Start of example –>
                 <script>
                   var myDate         = new Date();               // returns the date object
                   var myMonth        = myDate.getMonth();        // 0 through 11
                   var myDay          = myDate.getDate();         // 1 through 31
                   var myDayOfWeek    = myDate.getDay();          // 0 through 6 –  0 = Sunday
                   var myYear         = myDate.getFullYear();     // 4 digit year
                   var myHour         = myDate.getHours();        // 0 through 23
                   var myMinutes      = myDate.getMinutes();      // 0 through 59
                   var mySeconds      = myDate.getSeconds();      // 0 through 59
                   var myMillSec      = myDate.getMilliseconds(); // 0 through 999
                   var months  = new Array("January",   "February", "March",    "April",
                                            "May",       "June",     "July",     "August",
                                          "September", "October",  "November", "December");
                   var days    = new Array("Sunday",   "Monday", "Tuesday","Wednesday",
                                           "Thursday", "Friday", "Saturday");
                 </script>

                 <p><mark> var myDate = new Date();</mark></p>
                 <p><mark> var myMillSec = myDate.getMilliseconds();</mark></p>
                 <script>
                    document.write("<p>The date is <mark> ", myDate, " </mark></p>");
                    document.write("<p>The Milli seconds is <mark> ", myMillSec, "</mark></p>");
                 </script>

                 <p><mark>The getMilliseconds() method returns 0 to 999. </mark></p>
      
    <!– End of example –>

  45. You can also type this code:
    function startTime() {
        var today=new Date();
        var h=today.getHours();
        var m=today.getMinutes();
        var s=today.getSeconds();
        m = checkTime(m);
        s = checkTime(s);
        document.getElementById('txt').innerHTML = h+":"+m+":"+s;
        var t = setTimeout(function(){startTime()},500);
    }

    function checkTime(i) {
        if (i<10) {i = "0" + i};  // add zero in front of numbers < 10
        return i;
    }

Leave a Reply