<h1>Contador de caracteres</h1>

<form name="form_main">
  <fieldset>
    <legend>Contador</legend>
    <label for="text">Texto:</label> <br>
    <textarea name="text" id="text" cols="30" rows="10" oninput="countText()"></textarea><br>
    <label for="characters">Caracteres: </label><span id="characters"></span><br>
    <label for="words">Palavras: </label><span id="words"></span><br>
    <label for="rows">Linhas: </label><span id="rows"></span><br>
  </fieldset>
</form>

function countText() {
  let text = document.form_main.text.value;
  document.getElementById('characters').innerText = text.length;
  document.getElementById('words').innerText = text.length == 0 ? 0 : text.split(/\s+/).length;
  document.getElementById('rows').innerText = text.length == 0 ? 0 : text.split(/\n/).length;
}