Javascript How To Count Words simple tool coding for your Blogger

Javascript How To Count Words simple  tool coding for your Blogger How To Count Words Blogger tool code JS, HTML, and CSS with example 

In this post you will learn how to create a simple web page word counter or add for your blogger with an input box for the user to enter a sentence and an output box to display the word count number of words, you can use simple HTML, JAVASCRIPT, and CSS.

Javascript How To Count Words simple  tool coding for your Blogger

Code:

HTML

    <title>Word Count</title>

    <style>

        #result {

            margin-top: 10px;

        }

   

 CSS

</style>

    <label for="inputText">Enter a sentence:</label>

    <input type="text" id="inputText" placeholder="Type a sentence...">

    <button onclick="countWords()">Count Words</button>

    <div id="result"></div>

   

JAVASCRIPT 

<script>

        function countWords() {

            // Get the input text

            var inputText = document.getElementById("inputText").value;

            // Count words

            var wordCount = 0;

            if (inputText.trim() !== "") {

                var words = inputText.split(/\s+/);

                wordCount = words.length;

            }

            // Display result

            var resultDiv = document.getElementById("result");

            resultDiv.innerHTML = "Word count: " + wordCount;

        }

    </script>

 

Output:

Enter a sentence:

Enter a sentence: 

In this example: 

The HTML JS codes include an input box, a button, and a result div. The JavaScript function countWords() is triggered when the button is clicked. The function gets the input text, counts the words, and updates the result div with the word count. You can save this code in an HTML file and open it in a web browser. When you type a sentence into the input box and click the "Count Words" button, the word count will be displayed below.

See more intersting posts of our blog Blogger coding tips