How to pre-select an input element when the page loads in HTML5? Last Updated : 25 Jul, 2024 Summarize Comments Improve Suggest changes Share Like Article Like Report In this article, we are going to pre-select an input element when the page loads i.e. the user doesn't have to click the first text box to start writing on it. When the page is loaded the input is to be pre-selected and the user can start typing directly. This can be done by using the autofocus attribute. It is a boolean attribute that brings an element into focus and supports <button>, <input>, <select>, and <textarea> elements.Approach:Create a div for the HTML form.We will make input elements inside a form of type text and add autofocus to the username.On page load, we will see that username will be in focus, and we can directly start typing.Syntax :<input type="text" autofocus>Example: In this example, we will see the use of an input element with its property for pre-selecting when the page loads. HTML <!DOCTYPE html> <html lang="en"> <body> <h1> pre-select an input element </h1> <form> <label>Username:</label><br> <input type="text" name="username" autofocus> <br> <label>Email id:</label><br> <input type="text" name="email_id"> <br><br> <input type="submit" value="Submit"> </form> </body> </html> Output: Comment More infoAdvertise with us Next Article How to specify the type of an input element using HTML ? D darksiderrohan Follow Improve Article Tags : Web Technologies HTML HTML5 HTML-Questions Similar Reads How to specify that an option should be pre-selected when the page loads in HTML5? The <option> tag defines an option in a select list. The <option> tag is generally used with the value attribute to specify which value should be sent to the server for further processing. When a drop-down list is created using the <select> element, the first option or the first ch 2 min read How to focus element while loading the page in HTML ? HyperText Markup Language(HTML) is the basic building block of web pages that defines a structure. This markup language is used by browsers to manipulate data like text, images, and other content so that they can be displayed in the required format. HyperText refers to the links that connect web pag 3 min read How to specify the type of an input element using HTML ? In this article, we will specify the type of an input element using HTML. The HTML <input> type attribute is used to specify the type of <input> element to display. The default type of <input> type attribute is text. Syntax: <input type="value"> Attribute Values: button: It i 4 min read How to specify the value of an input element using HTML ? In this article, we will set the value of an input element using HTML. The value attribute for <input> element in HTML is used to specify the initial value of the input element. It has different meaning for different input type: The “buttonâ€, “reset†and “submit†property specifies the text on 1 min read How to set a keygen element that automatically get focused when page loads in HTML5 ? The <keygen> tag in HTML is used to specify a key-pair generator field in a form. The purpose of this element is to provide a secure way to authenticate users. When a form is submitted then two keys are generated, private key and public key. The private key is stored locally, and the public ke 1 min read How to select all Text in HTML Text Input when clicked using JavaScript? To select the text in HTML Text Input we can use the JavaScript DOM methods and we will select the text when we click the text box.Using document.getElementById() methodSyntax:<input onClick="this.select();" > or document.getElementById("ID").select();Example 1: We will use "this.select()" in 1 min read Like