Submodule 7.3: Word count
The idea!
A textarea accepts text input from the keyboard. We will add a feature to this textarea that provides an approximate word count for the user input.
To do this successfully, you'll need to:
- Create your own Javascript file in the "js" directory of the folder "yourNameWEB2JS". You have already created this directory in the exercise of submodule 6.1. Call it "countsTheWords.js".
- Add a
<script>
tag to the page at the bottom that loads your new js file. - In your js file:
- Use
document.getElementById()
to get the textarea element from the page. You'll need its id, which you can find on the HTML page. - Write an event handler function that runs every time someone types in the textarea. It will look something like this:
myTextareaElement.onkeyup = function(){
/* your code goes here*/
} - You'll want to access the
.value
property of the textarea to get the contents of the box as a String - Use
string.split()
to divide the string (at word boundaries) into an array of Strings - Count the elements in the array. This will be (roughly) the number of words in the box
- Write that value into the HTML element that looks like this:
<span id="wordcount"></span>