Tip: 1000 ms = 1 second.
<!DOCTYPE html>
<html>
<body>
<script language=javascript>
function f1() { document.bgColor="red"; window.setTimeout("f2()",1500)}
function f2() { document.bgColor="green"; window.setTimeout("f3()",1500)}
function f3() { document.bgColor="blue" ; window.setTimeout("f4()",1500) }
function f4() { document.bgColor="orange" ; window.setTimeout("f5()",1500) }
function f5() { document.bgColor="yellow" ; window.setTimeout("f6()",1500) }
function f6() { document.bgColor="pink" ; window.setTimeout("f7()",1500) }
function f7() { document.bgColor="brown" ; window.setTimeout("f1()",1500) }
function msg() { window.status="Display 7 different colors onMouseOver Event" }
</script>
<form name=frm1>
<input type=button name=btn1 value="Put Mouse on Me" onMouseOver="f1()">
<br><br>
<input type=button name=btn2 value="Click Me" onClick="msg()">
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<body onLoad="f1()" onUnload="msg()">
<h1> Change background color using onLoad() event </h1>
<h2> press f5 key to runonUnload() event to display alert message</h2>
</body>
<script language=javascript>
function f1() { document.bgColor="red"; window.setTimeout("f2()",1000)}
function f2() { document.bgColor="green"; window.setTimeout("f3()",1000)}
function f3() { document.bgColor="blue" ;window.setTimeout("f4()",1000) }
function f4() { document.bgColor="orange" ;window.setTimeout("f5()",1000) }
function f5() { document.bgColor="yellow" ;window.setTimeout("f6()",1000) }
function f6() { document.bgColor="pink" ;window.setTimeout("f7()",1000) }
function f7() { document.bgColor="brown" ;window.setTimeout("f1()",1000) }
function msg() { alert("Display 7 different colors onMouseOver Event"); }
</script>
</html>
<html>
<body>
<h1> Form Validation </h1>
<form name="f1">
Name: <input type="text" name="n1"><br><br>
Address: <textarea name="a1" cols=15 rows=5
placeholder="Your Address"></textarea><br><br>
Contact: <input type="tel" maxlength="10" name="c1"><br><br>
E-mail: <input type="email" name="e1" pattern="[A-Z][a-z]{5}-[@]{1}-[.]{1}"
placeholder="Amit@gmail.com"><br><br>
<input type="button" name="button1" value="SUBMIT" onClick="chk()"><br><br>
</from>
</body>
<script language=javascript>
functionchk()
var x=f1.e1.value;
varatpos=x.indexOf("@");
varlastat=x.lastIndexOf("@");
varfirstdot=x.indexOf(".");
vardotpos=x.lastIndexOf(".");
if(atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length || firstdot<atpos || atpos<lastat)
alert("Invalid e-mail id");
f1.e1.focus();
else
alert("Valid e-mail id");
return true;
</script>
</html>
<!doctypehtml>
<html>
<head><title> check vowels </title>
<script type=text/javascript>
function count()
vars,i,c,ch
c=0
s=f1.t1.value
for(i=0;i<=s.length;i++)
ch=s.charAt(i)
if(ch=='a'||ch=='e'||ch=='i'||ch=='o'||ch=='u'||ch=='A'||ch=='E'||ch=='I'||ch=='O'||ch=='U')
c++
document.write("<br> Number of Vowels are "+c)
</script>
</head>
<body>
<h1> Accept String and Check Vowels </h1>
<form name="f1">
Enter any string:<input type="text" name="t1"/>
<input type="button" value="check_vowels" onClick="count()"/>
</form>
</body>
</html>
<!doctypehtml>
<html>
<head><title> Palindrome String </title>
<script type=text/javascript>
function check()
var s,s1,i,ch,n,p=1
s=f1.t1.value
s1=s.toLowerCase()
n=s1.length
for(i=0;i<n/2;i++)
if(s1.charAt(i)!=s1.charAt(n-1-i))
p=0
break
if(p==1)
document.write("<br> String is Plindrome")
else
document.write("<br> String is Not Plindrome")
</script>
</head>
<body>
<h1> Accept String and Check if Palindrome String </h1>
<form name="f1">
Enter any string:<input type="text" name="t1"/>
<input type="button" value="check_plindrome" onClick="check()"/>
</form>
</body>
</html>
<!doctypehtml>
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Celcius to Fahrenhet</h2>
<p>Insert a number into one of the input fields below:</p>
<p><input id="c" onkeyup="convert('C')"> degrees Celsius</p>
<p><input id="f" onkeyup="convert('F')"> degrees Fahrenheit</p>
<p>Note that the <b>Math.round()</b> method is used, so that the result will be returned as an integer.</p>
<script>
function convert(degree)
var x;
if (degree == "C")
x = document.getElementById("c").value * 9/5 + 32;
document.getElementById("f").value = Math.round(x);
else
x = (document.getElementById("f").value -32) * 5/9;
document.getElementById("c").value = Math.round(x);
</script>
</body>
</html>
<!doctypehtml>
<html>
<head><title> Student Grade </title>
<script type=text/javascript>
function grade()
var s1,s2,s3,s4,s5,s6,avg
s1=parseInt(f1.t1.value)
s2=parseInt(f1.t2.value)
s3=parseInt(f1.t3.value)
s4=parseInt(f1.t4.value)
s5=parseInt(f1.t5.value)
s6=parseInt(f1.t6.value)
avg=(s1+s2+s3+s4+s5+s6)/6
alert("Persrntage Marks= "+avg)
if(avg>=91 &&avg<=100)
alert("Grade A")
if(avg>=81 &&avg<=90)
alert("Grade B")
if(avg>=71 &&avg<=80)
alert("Grade C")
if(avg>=61 &&avg<=70)
alert("Grade D")
if(avg>=35 &&avg<=60)
alert("Grade F")
</script>
</head>
<body>
<h1> Accept marks of 6 subject and display grade </h1>
<form name="f1">
<h2> Enter Marks </h2>
English: <input type="number" name="t1"/><br><br>
IT: <input type="number" name="t2"/><br><br>
Physics: <input type="number" name="t3"/><br><br>
Chemistry: <input type="number" name="t4"/><br><br>
Maths: <input type="number" name="t5"/><br><br>
Biology: <input type="number" name="t6"/><br><br>
<input type="button" value="Show Grade" onClick="grade()"/>
</form>
</body>
</html>
Calculating the number of days between two dates in JavaScript required to use date
object for any kind of calculation. For that, first, get the internal millisecond value of the
date using the in-built JavaScript getTime() function. As soon as both the dates get
converted, proceed further by subtracting the later one from the earlier one which in turn
returns the difference in milliseconds. Later, the final result can be calculated by dividing
the difference (which is in milliseconds) of both the dates by the number of milliseconds
in one day.
Define two dates using new Date().
Calculate the time difference of two dates using date2.getTime() – date1.getTime();
Calculate the no. of days between two dates, divide the time difference of both the
dates by no. of milliseconds in a day (1000*60*60*24)
Print the final result using document.write().
<!doctypehtml>
<html>
<head><title> date diff. </title></head>
<body>
<script type = "text/javascript" >
var date1 = new Date("07/30/2019");
var date2 = new Date("06/30/2019");
varDifference_In_Time = date2.getTime() - date1.getTime();
varDifference_In_Days = Difference_In_Time / (1000 * 3600 * 24);
document.write("<h2>date1 </h2>"+ date1 + " and <br><br>")
document.write("<h2>date 2 </h2>"+ date2 + " is: <br><br>")
document.write("<h2>Total number of days between dates </h2>"+ Difference_In_Days +" days");
</script>
</body>
</html>
After changing date values
