Time display using getElementById (hh:mm:ss) is not reflected

Asked 2 months ago, Updated 2 months ago, 2 views

I am trying the code in the book below to study javascript.

HTML & CSS for those who are about to start the web, Javascript _Create Timer

However, despite writing the same code, 時間 time cannot be obtained and in time display cannot be repainted for p elements written in HTML using the innerHTML property method.

<!DOCTYPE html>
<html lang="ja">
<head>
    <metacharset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title> TIMER</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
    <div class="container">
        <pid="timer">00:00:00</p>
    </div>

    <div>
        <button id="start_stop" class="btn btn-lg btn-danger">START</button>
    </div>

    <script>
        var now = new Date();
        var seconds = now.getSeconds();
        The // getSeconds method is a Date object method that can retrieve the current second.Images that can be used from now to (now.) by realization //
        if(seconds<10){
            seconds = '0' + seconds;
        }
        // ↑ For now, to display the "second" part in double digits //
        var minutes = now.getMinutes();
        if(minutes<10){
            minutes = '0' + minutes;
        }
        var hours = now.getHours();
        if(hours<10){
            hours = '0' + hours;
        }
        document.getElementById('timer').innerHTML=hours+':'+minutes+':'+seconds;
    </script>

</body>
</html>

Thank you for your cooperation

javascript

2022-09-30 11:14

1 Answers

I think you can get the time by using the code attached to the questionnaire.

The book support site distributed a sample file, so I compared the contents, but I think the reason why the style doesn't change is because the path to css is wrong.
In the book, you create a subfolder like css/style.css, and the actual style sheet is placed in it.

<link rel="stylesheet" href="css/style.css">

The HTML you wrote specifies files in the same hierarchy.

<link rel="stylesheet" type="text/css" href="style.css">


2022-09-30 11:14

If you have any answers or tips


© 2022 OneMinuteCode. All rights reserved.