Word count alpine js

<div x-data="{ wordCount: 0 }" x-init="wordCount = $el.querySelector('textarea').value.trim().split(' ').length;">
  
  <textarea class="form-input border" rows=5 @keyup="wordCount = $event.target.value.trim().split(' ').length;"></textarea>
       
  <p class="text-xs" :class="wordCount < 20 ? 'text-red-700' : 'text-green-700'">Word counts: <span x-html="wordCount"></span> min: 20</p>
</div>

Source: codepen.io

Similar codes

0 vote323 views1 answer
Como tirar a sublinhado da tag a
Html
57 votes350 views5 answers
Link to external site html
Html
1 vote329 views1 answer
Js on page finished loading
Html
0 vote334 views1 answer
Html icon animation
Html
0 vote322 views1 answer
Ruby and rails html show date year
Html
0 vote284 views1 answer
Hug
Html
0 vote338 views1 answer
How to enter through a button that is closed in a html code
Html
0 vote319 views1 answer
How to include the trademark symbol in html
Html
0 vote355 views1 answer
Include html file in html file
Html
0 vote327 views1 answer
Html input clear history
Html