Scribd
Upload
16 views4 pages

JavaScript Event Handling Examples

The document contains examples of various JavaScript events including 'if' constructs, click events, mouseover events, keydown events, and load events. Each section demonstrates how to use these events to interact with HTML elements and display messages. The examples are structured in HTML format with embedded JavaScript code for functionality.

Uploaded by

bharathsekar9009
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
16 views4 pages

JavaScript Event Handling Examples

The document contains examples of various JavaScript events including 'if' constructs, click events, mouseover events, keydown events, and load events. Each section demonstrates how to use these events to interact with HTML elements and display messages. The examples are structured in HTML format with embedded JavaScript code for functionality.

Uploaded by

bharathsekar9009
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

If construct

<html>
<body>
<div id ="demo"></div>
<script type="text/javascript">
const output = [Link]("demo")
let book = "maths";
if (book == "history") {
[Link]="<b>History Book</b>";
} else if (book == "maths") {
[Link]="<b>Maths Book</b>";
} else if (book == "economics") {
[Link]="<b>Economics Book</b>";
} else {
[Link]="<b>Unknown Book</b>";
}
</script>
<p> Set the variable to a different value and then try... </p>
</body>
<html>
Click event

<html>
<head> Javascript Events </head>
<body>
<script language="Javascript" type="text/Javascript">
<!--
function clickevent()
{
[Link]("This is JavaTpoint");
}
//-->
</script>
<form>
<input type="button" onclick="clickevent()" value="Who's this?"/>
</form>
</body>
</html>

MouseOver Event

<html>
<head>
<h1> Javascript Events </h1>
</head>
<body>
<script language="Javascript" type="text/Javascript">
<!--
function mouseoverevent()
{
alert("This is JavaTpoint");
}
//-->
</script>
<p onmouseover="mouseoverevent()"> Keep cursor over me</p>
</body>
</html>
Keydown Event

<html>
<head> Javascript Events</head>
<body>
<h2> Enter something here</h2>
<input type="text" id="input1"
onkeydown="keydownevent()"/>
<script>
<!--
function keydownevent()
{
[Link]("input1");
alert("Pressed a key");
}
//-->
</script>
</body>
</html>

Load event

<html>
<head>Javascript Events</head>
</br>
<body onload="[Link]('Page successfully
loaded');">
<script>
<!--
[Link]("The page is loaded successfully");

You might also like