Javascript Get Custom Data Attribute Value Example

Apr 19, 2021 . Admin

Hello Friends,

Now let's see example of how to get custom data attribute value. We will use how to get custom data attribute value in javascript. Here you will learn how to get custom data attribute value. This is a short guide on get custom data attribute value. Let's get started with get custom data attribute value in javascript.

Here i will give you many example how to get custom data attribute value.

Example: 1
<!DOCTYPE html>
<html>
	<head>
		<title>Javascript - How to get custom data attribute value?-MyWebtuts.com</title>	
	</head>
	<body>

		<h1 class="Testing">Java Script</h1>

		<p>Click the button to display the value of the class attribute of the h1 element.</p>

		<button onclick="testFunction()">Try it</button>

		<p id="stud"></p>

		<script>

			function testFunction() {
			  	var a = document.getElementsByTagName("H1")[0].getAttribute("class"); 
			  	document.getElementById("stud").innerHTML = a;
			}

		</script>

	</body>
</html>
Output: 1
Testing
Example: 2 In this example i will use attribute for onclick event.
<!DOCTYPE html>
<html>
	<head>
		<title>Javascript - How to get custom data attribute value?-MyWebtuts.com</title>	
	</head>
	<body>

	<p>Click the button to display the value of the onclick attribute of the button element.</p>

	<button id="myBtn" onclick="testFunction()">Testing</button>

	<p id="stud"></p>

		<script>

			function testFunction() {
			  	var x = document.getElementById("myBtn").getAttribute("onclick");
			  	document.getElementById("stud").innerHTML = x;
			}

		</script>

	</body>
</html>
Output: 2
testFunction()

It will help you....

#Javascript