Event object: When an event occurs, the browser automatically creates the object and contains the type of the event, mouse coordinates, etc.
Properties of event object: Format: event.properties.
Some instructions:
event represents the status of the event, such as the element that triggers the event object, the position and status of the mouse, the key pressed, etc.
The event object is only valid during the event.
The event in firefox is different from that in IE. The event in IE is a global variable that is available at any time; the event in firefox must be booted with parameters, and is a temporary variable at runtime.
In IE/Opera, in Firefox it is an event;
And the object of the event is in IE, in Firefox, and both are available in Opera.
Binding events
In JS, you can usually take two methods to bind events to an object (control):
First define a function in the head:
<script type="text/javascript">
function clickHandler()
{
//do something
alert("button is clicked!");
}
</script>
The first way to bind events:
<input type="button" value="button1" onclick="clickHandler();"><br/>
The second way to bind events:
<input type="button" value="button2">
<script type="text/javascript">
var v = ("button2");
= clickHandler; //The function name is used here, and no brackets are added
</script>
Other examples
Example 1:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./">-->
<script>
function mOver(object) {
= "red";
}
function mOut(object) {
= "blue";
}
</script>
</head>
<body>
<font style="cursor:help"
onclick="=''"
onmouseover="mOver(this)" onmouseout="mOut(this)">Welcome</font>
</body>
</html>
Example 2:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./">-->
</head>
<body>
<script type="text/javascript">
function getEvent(event) {
alert("Event Type: " + );
}
("Click...");
= getEvent;
</script>
</body>
</html>