JavaScript Get Element By id, name, class, tag value

JavaScript Get Element By id, name, class, tag value

Javascript access the dom elements by id, class, name, tag, attribute and it’s values. Here you will learn how to get html elements values, attributes by id, class, name, tag, attribute value.

javascript get element by id

You can use the javascript method getElementById() for getting the value of html elements.

JavaScript get Element by id Example

<html>
<head>
<title>JavaScript get Element by id Example</title>
</head>

<body>
<input id='my_id' value="Hello This is test">
<button onclick="getElementBy();">getElementById</button>
<script type="text/javascript">

function getElementBy()
{
 elem = document.getElementById('my_id').value;
 alert(elem);
}
</script>
</body>
</html>

javascript get element by class

You can use the javascript method getElementsByClassName() for getting the value of html elements.

JavaScript get Element by class name Example

<html>
<head>
<title>JavaScript get Element by class name Example</title>
</head>

<body>
<input class='my_class' value="Hello This is test">
<button onclick="myFunc();">getElementsByClassName</button>
<script type="text/javascript">

function myFunc()
{
 elem = document.getElementsByClassName('my_class');
 alert(elem[0].value);
}
</script>
</body>
</html>

javascript get element by name

You can use the javascript method getElementsByName() for getting the value of html elements.

JavaScript get Element by Name Example

<html>
<head>
<title>JavaScript get Element by Name Example</title>
</head>

<body>
<input name='my_name' value="Hello This is test">
<button onclick="myFunc();">getElementsByName</button>
<script type="text/javascript">

function myFunc()
{
 elem = document.getElementsByName('my_name')[0].value;
 alert(elem);
}
</script>
</body>
</html>

javascript get element by tag

You can use the javascript method getElementsByTagName() for getting the value of html elements.

JavaScript get Element by Tag Name Example

<html>
<head>
<title>JavaScript get Element by Tag Name Example</title>
</head>

<body>
<input value="Hello This is test">
<button onclick="myFunc();">getElementsByTagName</button>
<script type="text/javascript">

function myFunc()
{
 elem = document.getElementsByTagName('input')[0].value;
 alert(elem);
}
</script>
</body>
</html>

javascript get element by attribute

You can use the javascript method getElementsByTagName() for getting the value of html elements.

JavaScript get Element by Attribute Example

<html>
<head>
<title>JavaScript get Element by Attribute Example</title>
</head>

<body>
<input class="my_class" value="Hello This is test">
<button onclick="myFunc();">getElementsByAttribute</button>
<script type="text/javascript">

function myFunc()
{
 elem = document.getElementsByTagName("input")[0].getAttribute("class");
 alert(elem);
}
</script>
</body>
</html>

Recommended JavaScript Tutorial

  1. JavaScript Create & Call Functions with Example
  2. JavaScript Operators With Examples
  3. String Contains JavaScript | String includes() Method
  4. JavaScript Replace String With Examples
  5. JavaScript Array splice() Method By Example
  6. JavaScript: Clone an Array & Object By Examples
  7. Sorting Using JavaScript Array Sort() Method
  8. JavaScript: Convert String to Array JavaScript
  9. javaScript Push() Array By Example
  10. javaScript Push Array, Items Into Array Example
  11. Check the Object is Array or not in javascript
  12. JavaScript: Important Array Methods
  13. Highlight Search Result Vanilla JavaScript

Leave a Reply

Your email address will not be published. Required fields are marked *