Exploring JavaScript:
I am writing this because I have done several projects today, several projects done, and JavaScript DOM projects,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Task -8 Word Counter</title>
</head>
<body>
<h1>Word Counter</h1>
<textarea id="Mytext" rows="7" cols="45" placeholder="Enter Something....."></textarea>
<p>Words :<span id="wordcount">0</span></p>
<p>Character :<span id="charcount">0</span></p>
<script>
let Mytext1 = document.getElementById("Mytext");
let wordcount1 = document.getElementById("wordcount");
let charcount1=document.getElementById("charcount")
Mytext1.addEventListener("input", function () {
wordcount1.textContent = Mytext1.value.split(" ").length;
charcount1. textContent=Mytext1.value.length;
})
</script>
</body>
</html>
Today learned some interview questions about DOM JavaScript.
1.Get element=getElementById("id").
- display on-screen content: text content.
- innertext=show only gets visible text.
Conclusion:
Through this simple example, I've gained a deeper understanding of event handling in JavaScript and how we can dynamically manipulate the Document Object Model (DOM).
Top comments (1)
Thanks for this . Are we manipulating the HTML via DOM API using JS , Is that right?