<
body
id
=
"GFG"
>
<
form
>
<
label
> Type Something</
label
>
<
input
type
=
"text"
onChange
=
invokingOnChangeEvent
()
oninput
=
invokingOnInputEvent
()
onkeydown
=
invokingOnKeyDownEvent
()
onkeyup
=
invokingOnKeyUpEvent
()
onkeypress
=
invokingOnKeyPressEvent
()>
</
form
>
<
script
>
function invokingOnInputEvent(event) {
console.log("onInput event occurred")
document.getElementById("GFG")
.style.backgroundColor = 'red';
}
function invokingOnChangeEvent(event) {
console.log("onChange event occurred")
document.getElementById("GFG")
.style.backgroundColor = 'green';
}
function invokingOnKeyPressEvent(event) {
console.log("onKeyPress event occurred")
document.getElementById("GFG")
.style.backgroundColor = 'yellow';
}
function invokingOnKeyUpEvent(event) {
console.log("onKeyUp event occurred")
document.getElementById("GFG")
.style.backgroundColor = 'pink';
}
function invokingOnKeyDownEvent(event) {
console.log("onKeyDown event occurred")
document.getElementById("GFG")
.style.backgroundColor = 'orange';
}
</
script
>
</
body
>