Tutorial: Display Running Time in JavaScript with Free Source Code
This tutorial will show you how to display a running time using PHP and Javascript. This tutorial does not include a good design but will give you knowledge on how to create a simple running time.
Creating a Time Script
This script creates our running time. In this script, we have also included a small PHP code to show our running time. So, for us to confirm the time in our desired page, we need to add the script. To create the text, open your HTML code editor and paste the code below after the tag. We name this script as “time.php”.
<span id=tick2> <script> function show2(){ if (!document.all&&!document.getElementById) return thelement=document.getElementById? document.getElementById("tick2"): document.all.tick2 var Digital=new Date() var hours=Digital.getHours() var minutes=Digital.getMinutes() var seconds=Digital.getSeconds() var dn="PM" if (hours<12) dn="AM" if (hours>12) hours=hours-12 if (hours==0) hours=12 if (minutes<=9) minutes="0"+minutes if (seconds<=9) seconds="0"+seconds var ctime=hours+":"+minutes+":"+seconds+" "+dn thelement.innerHTML=ctime setTimeout("show2()",1000) } window.onload=show2 //--> </script> </span> <?php $date = new DateTime(); echo $date->format('l -- F j, Y'); ?>
Creating a Show Page
Lastly, we create a page where we want to show our time. To create the page, open your HTML code editor and paste the code below after the tag. We name this page as “index.php”.
<!DOCTYPE HTML> <html> <head> <title>Simple Running Time using PHP</title> </head> <body> <?php include ('time.php'); ?> </body> </html>
Happy Coding!