HTML | onfocus Event Attribute

This onfocus attribute works when the element gets focused. This event attribute is mostly used with <input>, <select>, <a> elements. This event attribute is supported by all HTML elements excepts <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, and <title> elements.
Supported Tags: It supports all HTML elements which are given below:

<base>
<bdo>
<br>
<head>
<html>
<iframe>
<meta>
<param>
<script>
<style>
<title>

Syntax:

<element onfocus = "script">

Attribute Value: The script value run when onfocus attribute called.
Example:

html

<!DOCTYPE html>

<html>

    <head>

        <title>onfocus attribute</title>

        <style>

            h1 {

                color:green;

            }

            body {

                text-align:center;

            }

            input {

                color:white;

                margin-top:5px;

                border:1px solid black;

                border-radius:3px;

            }

        </style>

        <script>

            function sudo(x) {

                document.getElementById(x).style.background = "green";

            }

        </script>

    </head>

    <body>

        <h1>GeeksforGeeks</h1>

        <h2>onfocus event attribute</h2>

        First name: <input type="text" id="fname"

        onfocus="sudo(this.id)"><br>

        Last name: <input type="text" id="lname"

        onfocus="sudo(this.id)">

    </body>

Output:

Supported Browsers: The browser supported by onfocus attribute are listed below:

Apple Safari 3.1
Google Chrome 1
Edge 12
Firefox 24
Opera 11.6
Internet Explorer 9

Article Tags :

HTML

Web Technologies

HTML-Attributes