<html>
<head>
<script type="text/javascript">
function sayHello() {
alert("Hello World!")
}
</script>
</head>
<body>
<p>Click the button to see result</p>
<form>
<input type="button" onclick="sayHello()" value="Say Hello" />
</form>
</body>
</html>
<html>
<body>
<button id="btn">Click here</button>
<p id="para" onmouseover="mouseOver()" onmouseout="mouseOut()">Hover over this Text !</p>
<b id="output"></b>
<script>
var x = document.getElementById("btn");
x.addEventListener("click", btnClick);
function mouseOver() {
document.getElementById("output").innerHTML += "MouseOver Event" + "<br>";
}
function mouseOut() {
document.getElementById("output").innerHTML += "MouseOut Event" + "<br>";
}
function btnClick() {
document.getElementById("output").innerHTML += "Click Event" + "<br>";
}
</script>
</body>
</html>
<html>
<head>
<script>
function changeColor(color)
{
var panel = document.getElementById('panel')
document.body.style.backgroundColor = color
panel.innerHTML = "Background color is set to: " + color.toUpperCase()
}
</script>
</head>
<body onload="changeColor('red')">
<p>Select option to change background color of page</p>
<form name="myform">
<input type="radio" name="color" value="red" onchange="changeColor(this.value)" checked="false">RED<br />
<input type="radio" name="color" value="green" onchange="changeColor(this.value)">GREEN<br />
<input type="radio" name="color" value="blue" onchange="changeColor(this.value)">BLUE<br />
</form>
<p id="panel"></p>
</body>
</html>