After adding a button line to enable a clock in HTML and the corresponding function in a <script>
tag (which may or may not work), suddenly all functions on the page become undefined. There is only one other function on that page, so it could be causing the issue. I've spent some time looking for syntax errors but haven't been able to find anything.
The order of elements on the page should follow JavaScript, then CSS, then HTML.
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(startTime, 500);
}
function checkTime(i) {
if (i < 10) {i = "0" + i};
return i;
}
.headtitle {
color:red;
font-family: "Courier New", Courier, monospace;
display: flex;
flex-wrap: wrap;
justify-content: center;
border: 5px solid #00f;
padding: 10px;
}
.subtitle{
display: flex;
flex-wrap: wrap;
justify-content: center;
font-size: 1.25rem
}
a.firstlink{
word-spacing: 30px;
}
a:visited{
color:lightblue
}
body{
background-image: url("http://i.kinja-img.com/gawker-media/image/upload/a942qcqwrcmveiq37zli.png");
background-repeat:repeat;
color: white;
}
.list{
display: inline;
}
.list li{
display: inline;
padding-left: 1.5rem;
}
.button{
float:right;
border: 1px solid #f00;
padding: 5px
}
.button:active{
position: relative;
top: 2px;
left: 2px;
}
.JavascriptButton{
float:right;
}
.clickText{
cursor:pointer;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="Website task.css">
<script type="text/javascript" src="new 1.js"></script>
<script type="text/javascript">
function openFunction() {
window.open('Website Task.html', '_blank');
}
function showTime() {
document.getElementByID("currentTime").innerhtml = "The time now is" startTime();
}
</script>
<title>JavaScript page</title>
</head>
<body>
<div class="header">
<h1 class="headtitle">JavaScript demo page</h1>
<p class="subtitle">This page is for demonstrating functions in JavaScript specifically, as well as jQuery.</p>
<p id="currentTime"></p>
<button onclick="showTime()">Click here to display the current time</button>
<p></p>
<a class="clickText" onclick="openFunction()">Click this text to go back to the previous page in a new window</a>
<button class="JavascriptButton" onclick="window.location='Website Task.html';">Previous page</button>
</div>
</body>
</html>