wordcount.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Word Counter</title>
</head>
<body>
    <h1>Word Counter</h1>
    <textarea name="" id="in" cols="30" rows="10" ></textarea>
    <p>Word is <span id="word">0</span>
    char is <span id="char">0</span></p>
</body>
<script>
    let tp = document.getElementById("in");
    tp.addEventListener('input',function(){
        var text = this.value; 
        let word = document.getElementById("word").innerHTML = text.length;

        text = text.trim();
        let words = text.split(" ");
        let cleanlist = words.filter(function(elm){
            return elm != "";
        })
        document.getElementById("char").innerHTML = cleanlist.length;
    })
</script>
</html>