• We just launched and are currently in beta. Join us as we build and grow the community.

JavaScript - Count Vowels and Consonant in a Sentence

pindakanker

Absurdity Curator
P Rep
0
0
0
Rep
0
P Vouches
0
0
0
Vouches
0
Posts
152
Likes
134
Bits
2 MONTHS
2 2 MONTHS OF SERVICE
LEVEL 1 200 XP
In this tutorial we will create a Count Vowels and Consonant in a Sentence using Javascript. JavaScript is a scripting or programming language that allows you to implement complex things on web pages. It is widely used in designing a stunning website. It is an interpreted programming language that has a capabilities of Object-Oriented. So Let's do the coding..

Getting started:

This is the link for the bootstrap that i used for the layout design https://getbootstrap.com/.

The Main Interface

This code contains the interface of the application. To create this just write these block of code inside the text editor and save this as index.html.
  1. <!DOCTYPE html>
  2. <html

    lang

    =

    "en"

    >
  3. <head

    >
  4. <meta

    charset

    =

    "UTF-8"

    name

    =

    "viewport"

    content

    =

    "width=device-width, initial-scale=1"

    /

    >
  5. <link

    rel

    =

    "stylesheet"

    type

    =

    "text/css"

    href

    =

    "css/bootstrap.css"

    /

    >
  6. </

    head

    >
  7. <body

    >
  8. <nav class

    =

    "navbar navbar-default"

    >
  9. <div

    class

    =

    "container-fluid"

    >
  10. <a

    class

    =

    "navbar-brand"

    href

    =

    "https://sourcecodester.com"

    >

    Sourcecodester</

    a

    >
  11. </

    div

    >
  12. </

    nav>
  13. <div

    class

    =

    "col-md-3"

    ></

    div

    >
  14. <div

    class

    =

    "col-md-6 well"

    >
  15. <h3

    class

    =

    "text-primary"

    >

    JavaScript - Count Vowels and Consonant in a Sentence</

    h3

    >
  16. <hr

    style

    =

    "border-top:1px dotted;"

    /

    >
  17. <div

    class

    =

    "col-md-6"

    >
  18. <div

    class

    =

    "form-group"

    >
  19. <textarea

    id

    =

    "words"

    class

    =

    "form-control"

    style

    =

    "height:150px; resize:none;"

    ></

    textarea

    >
  20. </

    div

    >
  21. <button

    onclick

    =

    "countCheck();"

    class

    =

    "btn btn-primary"

    ><span

    class

    =

    "glyphicon glyphicon-eye-open"

    ></

    span

    >

    Check</

    button

    >
  22. <button

    onclick

    =

    "reset();"

    class

    =

    "btn btn-success"

    ><span

    class

    =

    "glyphicon glyphicon-refresh"

    ></

    span

    >

    Reset</

    button

    >
  23. </

    div

    >
  24. <div

    class

    =

    "col-md-6"

    >
  25. <div

    id

    =

    "result"

    >
  26. </

    div

    >
  27. </

    dvi>
  28. </

    div

    >
  29. <script

    src

    =

    "js/script.js"

    ></

    script

    >
  30. </

    body

    >
  31. </

    html

    >

Creating the Script

This code contains the script of the application.This code will count all the vowels and consonant in a word. To do this just copy and write these block of codes as shown below inside the text editor and save it as script.js inside the js folder.
  1. function

    reset(

    )

    {
  2. document.getElementById

    (

    'words'

    )

    .value

    =

    ""

    ;
  3. document.getElementById

    (

    'result'

    )

    .innerHTML

    =

    ""

    ;
  4. }

  5. function

    countCheck(

    )

    {
  6. var

    words =

    document.getElementById

    (

    'words'

    )

    .value

    ;

  7. if

    (

    words ==

    ""

    )

    {
  8. document.getElementById

    (

    'result'

    )

    .innerHTML

    =

    "<center><label class='text-danger'>Please enter some word</label></center>"

    ;
  9. }

    else

    {
  10. document.getElementById

    (

    'result'

    )

    .innerHTML

    =

    "<label style='font-size:24px;'>Vowels:</label> <label style='font-size:20px;' class='text-success'>"

    +

    vowels(

    words)

    +

    "</label><br /><label style='font-size:24px;'>Consonant:</label> <label style='font-size:20px;' class='text-success'>"

    +

    consonant(

    words)

    +

    "</label>"

    ;
  11. }
  12. }

  13. function

    vowels(

    str)

    {
  14. var

    vowels =

    "AEIOUaeiou"

    ;
  15. var

    count =

    0

    ;

  16. for

    (

    var

    i=

    0

    ;

    i <

    str.length

    ;

    i++

    )

    {
  17. if

    (

    vowels.indexOf

    (

    str[

    i]

    )

    !==

    -

    1

    )

    {
  18. count++;
  19. }
  20. }

  21. return

    count;
  22. }

  23. function

    consonant(

    str)

    {
  24. var

    consonant =

    "BCDFGHJKLMNPQRSTVWXYZbcdfghjklmnpqrstvwxyz"

    ;
  25. var

    count =

    0

    ;

  26. for

    (

    var

    i=

    0

    ;

    i <

    str.length

    ;

    i++

    )

    {
  27. if

    (

    consonant.indexOf

    (

    str[

    i]

    )

    !==

    -

    1

    )

    {
  28. count++;
  29. }
  30. }

  31. return

    count;
  32. }

There you have it we successfully created a Count Vowels and Consonant in a Sentence using Javascript. I hope that this simple tutorial help you to what you are looking for. For more updates and tutorials just kindly visit this site. Enjoy Coding!


Download
You must upgrade your account or reply in the thread to view the hidden content.
 

452,292

324,156

324,164

Top