-->
Showing posts with label oninput event. Show all posts
Showing posts with label oninput event. Show all posts

Thursday, June 5, 2025

JavaScript Program to Use getElementById and oninput event– DOM Manipulation in JS with Examples --- to count total characters entered by user

 

JS DOM programs collection


 JS program to show the concept of getElementById (DOM)



<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>counting typed characters</title>

</head>

<body>

Enter your text<br>

<textarea id="messagecount" oninput="charasCount();" rows="10" cols="10"></textarea>

<p>total characters you have types is:<span id="total">0</span></p>

<script>

function charasCount()

{

var i;

i=document.getElementById('messagecount').value;

document.getElementById('total').innerText=i.length;

}

</script>

</body>

</html>


Output:-

JS program to count total characters