Practical Aim: JavaScript and HTML code to check whether entered character is vowel or consonant using switch case
First, try at own
Video Tutorial: JavaScript to check whether entered character is vowel or consonant using switch case
Code
VowelorNot.html file [ switch case ]
<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>Vowel or Not</title>
    <style>
      .wrapper {
        padding: 10px;
        margin: 20px;
        background-color: blue;
      }
      input {
        height: 20px;
      }
      button {
        padding: 10px;
      }
      label {
        color: aliceblue;
        font-weight: bold;
      }
      p {
        color: aliceblue;
        font-weight: bold;
      }
    </style>
    <script>
      function checkVowelornot() {
        var ch;
        ch = document.getElementById("char").value;
        //window.alert(ch);
        if ((ch >= 'a' && ch <= 'z') || (ch >= 'A' && ch <= 'Z')) {
          switch (ch) {
            case 'a':
            case 'e':
            case 'i':
            case 'o':
            case 'u':
            case 'A':
            case 'E':
            case 'I':
            case 'O':
            case 'U':
              document.getElementById("result").innerHTML = "vowel character";
              break;
            default:
              document.getElementById("result").innerHTML = "Consonant character";
              break;
          }
        }
        else {
          document.getElementById("result").innerHTML = "Please Enter Character";
        }
  
      }
  
    </script>
  </head>
  <body>
    <div class="wrapper">
      <label>Enter The character: </label>
      <input id="char" placeholder="Enter character">
      <br><br>
      <button onclick="checkVowelornot()">Check</button>
      <p id="displayresult" style="display: block;">
        Output: <span id="result"></span>
      </p>
    </div>
  </body>
  </html>
Try here
<!DOCTYPE html >
  <html >
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <title>Untitled Document</title>
</head>
<body>
  <h1> Try your code here</h1>
  </body>
  </html>
Output

0 Comments