<html>
<head><title>JavScript</title>
<script>
window.alert("Success");
document.write(6*5);
</script>
</head>
<style>
button{
background:#C6F;
color:#000;
}
h1{
text-decoration:underline;
}
p{
background:#C06;
color:#CF9;
font-family:Georgia, "Times New Roman", Times, serif;
}
</style>
<body>
<h1>My First JavaScript...!</h1>
<button type="button" onClick="document.getElementById('demo').innerHTML='This is my first Script'">
Click me to display the content.</button>
<p id="demo"></p>
<h1>Script can change the images...!</h1>
<img id="myimage" onClick="change_image()" src="off.png" height="350" width="200">
<p>Click the image to on/off the bulb.</p>
<script>
function change_image(){
var image = document.getElementById('myimage');
if (image.src.match("on.png")) {
image.src = "off.png";
} else {
image.src = "on.png";
}
}
</script>
<h1>JS can change the style of the content...!</h1>
<button type="button" onClick="change_style()">Click Me to change the style of the content</button>
<script>
function change_style(){
var x = document.getElementById('free_trial');
x.style.color = "white";
x.style.background = "blue";
}
</script>
<p id="free_trial">This content should be change on button click...!</p>
<h1>JScript Can Validate Input...!</h1>
<p>Please enter any number b/w 1-10.</p>
<input id="num" type="number">
<button type="button" onClick="input_validation()">Check</button>
<p id="validation"></p>
<script>
function input_validation(){
var a,b;
a = document.getElementById('num').value;
if (a < 1 || a > 10)
{b = "Input is not Valid";}
else
{b = "Input is Correct";}
document.getElementById('validation').innerHTML = b;
}
</script>
<h1>Nothing Special</h1>
<button type="button" onClick="document.write(6+54)">Danger</button>
</body>
</html>
No comments:
Post a Comment