Event: is the behavior that can be detected by JavaScript, such as mouse click, mouse movement, common events are as follows
Code implementation "Click event":
<body>
<button onclick= "demo ()" > button </button>
<script>
Function Demo () {
Alert ("Hello");
}
</script>
</body>
Run results: Click on the Screen button, pop-up box hello
The code implements "mouse over":
1) Style.css contents are as follows:
div{
width:100px;
height:100px;
Font-weight:bold; " >crimson;
}
2) testjstty3.html contents are as follows:
<meta charset= "UTF-8" >
<title> Events </title>
<link rel= "stylesheet" type= "Text/css" href= "Style.css" >
<body>
<div clsss= "div" onmouseout= "onout (This)" onmouseover= "Onover (This)" > </div>
<script>
function Onout (ooj) {
Ooj.innerhtml= "Hello";
}
function Onover (ooj) {
Ooj.innerhtml= "World";
}
</script>
Running result: When moving past, the red box appears the world; When the mouse moves out, a hello appears.
Text Change event:
<body onload= "msg ()" > //Web download completion event, event when written in body
<div clsss= "div" onmouseout= "onout (This)" onmouseover= "Onover (This)" > </div>
<script>
function Onout (ooj) {
Ooj.innerhtml= "Hello";
}
function Onover (ooj) {
Ooj.innerhtml= "World";
}
</script>
<form>
<input type= "text" onchange= "Changedemo (This)" > //After entering content in the text box, the popup dialog box prompts the content to change
</form>
<script>
function Changedemo (BG) {
Alert ("content changed");
}
</script>
<form>
<input type= "text" onselect= "Selectdemo (This)" onfocus= "Focusdemo" >//mouse click on text box, text box turns green
</form>
<script>
The text box is selected and the text box becomes green.
function Selectdemo (BG) {
Bg.style.backgroundcolor= "Red";
}
function Focusdemo (BG) {
Bg.style.backgroundcolor= "Green";
}
function msg () {
Alert ("Web content download Completed");
}
</script>
Day two: JavaScript events