This tutorial will show you how to create a JavaScript function that checks whether a given year is a leap year (366 days) or not (365 days).
In this tutorial I aim to teach you how to check valid leap years in JavaScript. Basically I want you to be able to understand how to go through the application development cycle to create the most basic of applications so that you have the underpinnings to progress onto more complex projects. I do not state that this code is perfect but it does work. Once you have understood how the code works then you should understand how to improve it and make it run a lot faster.
Step1)Open notepad and enter the following
<html>
<head>
<script type="text/javascript">
Basically this starts the HTML page and places the script tag inside the header tag so that it can be called from anywhere in this HTML document.
Step2)Now I want you to begin a new function such as the function in the code below
function isleap(){
var yr=document.getElementById("year").value;
if ((parseInt(yr)%4) == 0){
if (parseInt(yr)%100 == 0){
if (parseInt(yr)%400 != 0){
document.getElementById("leapyear").src = "aintleap.gif";
return "false";
}
if (parseInt(yr)%400 == 0){
document.getElementById("leapyear").src = "isleap.gif";
return "true";
}
}
if (parseInt(yr)%100 != 0){
document.getElementById("leapyear").src = "isleap.gif";
return "true";
}
}
if ((parseInt(yr)%4) != 0){
document.getElementById("leapyear").src = "aintleap.gif";
return "false";
}
}
</script>
</head>
Basically this code is like a procedural handbook that an employer would draft up for all employees. In this handbook it gives the rules to check if a year is a leap year. If the year is no divisible by 4 then it is not a leap year. If the year is divisible by 100 but not by 400 then it is not a leap year. Otherwise the remaining options leave us with a leap year so I hard coded what to do. The Reason I have coded in what to do otherwise is to highlight the two different statements of verifying that something does match and verifying something does not match. Then The Script tags are ended and the head tag is ended.
Step3) Now that we have a working handbook we need to test the employees skills so that we can be sure the handbook is clear on what is to be done.
<body>
Year : <input type="text" id="year" size="4"><br />
<br>
<input type="button" value="Submit" onclick="isleap()">
<br>
<img src="blank.gif" id="leapyear" alt="displays if the year is a leap year">
</body>
</html>
This code defines the store if you will that our little JavaScript employee will be working at so that we can run some tests by your new employee. It defines a form within the body where it gives a said field an ID so that our JavaScript employee knows what to look at. It then tells the html form to call over the assistant once the form is completed.
All done you may have noticed that I got the function to return a value. This is for further expansion where other functions would check if there was a leap year so that for instance you could check the amount of days in February.
I hope this Tutorial has thought you something or you at least thought it was informative to those who may wish to know how to do something like this
