How to Access HTML Form Elements in JavaScript

In this tutorial, we will explain to you how to access HTML form elements in JavaScript. we can easily get HTML form elements value using javascript.

Example

<!DOCTYPE html>
<html>
<head>
  <title>How to Access HTML Form Elements in JavaScript</title>
  <script type="text/javascript">
  function send(){
    var name    = document.forms[0].elements[0].value;
    console.log(name);
    var email   = document.forms[0].elements[1].value;
    console.log(email);
    var message = document.forms[0].elements[2].value;
    console.log(message);
    }
  </script>
</head>
<body>
  <form>
    Enter your name:
    <input type="text" name="name"> <br> <br>
    Enter your Email: 
    <input type="email" name="email"> <br> <br>
    Enter Your Message: 
    <input type="text" name="message"> <br> <br>
    <input type="button" name="submit" value="send" onclick="send()" />
  </form>  
</body>
</html>

Output

w3snippets
w3@gmail.com
hi how are you

   

Related Article