SoFunction
Updated on 2025-04-06

Introduction to simple event handling and with usage of javascript

This issue introduces some simple event handling:
1. Mouse click
Copy the codeThe code is as follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:///TR/html4/">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">

<script type="text/javascript">
function click1(obj)
{
alert();
}
</script>
</head>

<body>
<div onclick="click1(this)" style="cursor:pointer">Click me</div>
</body>
</html>

This is the context of a div. After clicking, the content between <div> will pop up.
2. Mouse movement
Copy the codeThe code is as follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:///TR/html4/">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">

<script type="text/javascript">
function mouse1(obj)
{
= "#f00";
= "18px"
}
function mouse2(obj)
{
= "#000";
= "16px"
}
</script>
</head>

<body>
<div onmouseover="mouse1(this)" onmouseout="mouse2(this)">Move to here</div>
</body>
</html>

When the onmouseover mouse is placed there, the font will be larger, the font becomes red, and the font and color will be restored when it leaves.
usage
Copy the codeThe code is as follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:///TR/html4/">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">

<script type="text/javascript">
with(document)
{
write("niujiabin"+"<br/>");
write("maybe"+"<br/>");
write("gossip"+"<br/>");
}
</script>
</head>
<body>
</body>
</html>

The effect is the same as below
Copy the codeThe code is as follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:///TR/html4/">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">

<script type="text/javascript">
("niujiabin"+"<br/>");
("maybe"+"<br/>");
("gossip"+"<br/>");
</script>
</head>
<body>
</body>
</html>