1. The onfocus event occurs when the object gets focus.
Example:
<html> <head> <script type="text/javascript"> function setStyle(x) { document.getElementById(x).style.background="yellow" } </script> </head> <body> First name: <input type="text" onfocus="setStyle(this.id)" id="fname" /><br /> Last name: <input type="text" onfocus="setStyle(this.id)" id="lname" /> </body> </html>
Result: The input background color is yellow when the input window is clicked with the mouse
2. The onblur event occurs when the object loses focus;
Example:
<html> <head> <script type="text/javascript"> function upperCase() { var x=document.getElementById("fname").value document.getElementById( " fname " ).value = x.toUpperCase() //toUpperCase() method is used to convert the string to uppercase
}
</ script >
</ head >
<body> 输入您的姓名： <input type="text" id="fname" onblur="upperCase()"/></body></html>
Result: Enter lowercase English in the input window. When the input loses focus, the value content of the input just entered is converted to uppercase
3. The onload event occurs immediately after the page or image is loaded.
The window.onload callback function is actually executed after the page is loaded (including the display of image content), not during the waiting process of page loading.
example:
<html>
<head>
<script type="text/javascript">
function load()
{
window.status="Page is loaded"
}
</script>
</head>
<body onload="load()">
</body>
</html>
onload, load the image, load the content in the entire body, so add it to the body