Maison  >  Article  >  interface Web  >  Comment convertir des caractères en codes ASCII en utilisant JavaScript ?

Comment convertir des caractères en codes ASCII en utilisant JavaScript ?

WBOY
WBOYavant
2023-08-29 09:25:021238parcourir

如何使用 JavaScript 将字符转换为 ASCII 代码?

ASCII, qui signifie American Standard Code for Information Interchange, est une méthode de codage de caractères en les attribuant à des valeurs numériques spécifiques. Les valeurs numériques ainsi attribuées sont appelées codes ASCII et sont largement utilisées dans les systèmes informatiques pour représenter une variété de caractères, notamment des lettres, des chiffres, des signes de ponctuation et des caractères de contrôle spéciaux.

Exemple 1 : Utilisation de charCodeAt()

Le code suivant illustre un programme qui utilise la fonction "charCodeAt()" pour recevoir un caractère saisi par l'utilisateur puis affiche le code ASCII correspondant au caractère.

Grammaire

string.charCodeAt(index)

Algorithme

Étape 1 : Commencez par déclarer les balises HTML.

Étape 2 : Ajoutez des fonctionnalités d'interface utilisateur à la page Web à l'aide du CSS interne.

Étape 3 : Créez un champ de saisie pour permettre à l'utilisateur de saisir des caractères.

Étape 4 : Créez un bouton qui déclenchera une fonction qui convertit les caractères en ASCII.

Étape 5 : Créez la balise de script.

Étape 6 : Déclarez une fonction de conversion à l'intérieur de la balise <script>. </script>

Étape 7 : Déclarez les variables d'entrée pour obtenir la saisie de l'utilisateur.

Étape 8 : Utilisez la fonction charCodeAt() pour convertir les caractères en valeurs ASCII.

Exemple

<!DOCTYPE html>
<html>
<head>
  <title>Character to ASCII Converter</title>
//CSS Styling from here
  <style>
    body {
      font-family: Arial, sans-serif;
      background-color: #f5f5f5;
      margin: 0;
      padding: 20px;
      text-align: center;
    }

    h1 {
      color: #333;
    }

    .container {
      max-width: 400px;
      margin: 0 auto;
      background-color: #fff;
      padding: 20px;
      border-radius: 5px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }

    input[type="text"] {
      width: 100%;
      padding: 10px;
      margin-bottom: 10px;
      border: 1px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box;
      font-size: 16px;
    }

    button {
      width: 100%;
      padding: 10px;
      background-color: #4caf50;
      color: #fff;
      border: none;
      border-radius: 3px;
      cursor: pointer;
      font-size: 16px;
    }

    p {
      margin-top: 10px;
      font-size: 18px;
    }
  </style>
</head>
<body>
  <div class="container">
    <h1>Character to ASCII Converter</h1>
    //Designing input area for user
    <input type="text" id="inputText" placeholder="Enter a character">
    //creating button that convert the value
    <button onclick="convert()">Convert</button>
    <p id="output"></p>
  </div>

  <script>
  //Javascript code for converting characters to ASCII code 
  //creating function that will invoke as the user click on the button
    function convert() {
      const input = document.getElementById("inputText").value;
      const asciiCode = input.charCodeAt(0);
      document.getElementById("output").textContent = `ASCII code: ${asciiCode}`;
    }
  </script>
</body>
</html>

Cette fonction intégrée prend une chaîne et un index comme paramètres et renvoie le code ASCII du caractère à cet index. L'utilisateur saisit des caractères dans le champ de saisie de l'exemple HTML. Lorsque vous cliquez sur le bouton Convertir, le code JavaScript récupère les caractères, applique la fonction charCodeAt() et affiche le code ASCII sur la page Web.

Exemple 2 - Utilisation de codePointAt()

La fonction codePointAt() est une méthode inhérente de gestion des chaînes en JavaScript. Il obtient avec précision la valeur du point de code Unicode du caractère à l'index déterminé.

Dans ce code particulier, il est utilisé pour récupérer la valeur du point de code Unicode du caractère initial à partir de l'entrée utilisateur et l'afficher en sortie.

Grammaire

const codePoint = input.codePointAt(0);

Exemple

<!DOCTYPE html>
<html>
<head>
  <title>Character to ASCII Converter Using charPointAt()</title>
  //CSS Styling from here
  <style>
    body {
      font-family: Arial, sans-serif;
      background-color: #f5f5f5;
      margin: 0;
      padding: 20px;
      text-align: center;
    }

    h1 {
      color: #333;
    }

    .container {
      max-width: 400px;
      margin: 0 auto;
      background-color: #fff;
      padding: 20px;
      border-radius: 5px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }

    input[type="text"] {
      width: 100%;
      padding: 10px;
      margin-bottom: 10px;
      border: 1px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box;
      font-size: 16px;
    }

    button {
      width: 100%;
      padding: 10px;
      background-color: #4caf50;
      color: #fff;
      border: none;
      border-radius: 3px;
      cursor: pointer;
      font-size: 16px;
    }

    p {
      margin-top: 10px;
      font-size: 18px;
    }
  </style>
</head>
<body>
  <div class="container">
    <h1>Character to ASCII Converter Using charPointAt()</h1>
     //Designing input area for user
    <input type="text" id="inputText" placeholder="Enter a character">
    <button onclick="convert()">Convert</button>
    <p id="output"></p>
  </div>
   //Javascript code for converting characters to ASCII code
  <script>
     //creating function that will invoke as the user click on the button
    function convert() {
      const input = document.getElementById("inputText").value;
      const codePoint = input.codePointAt(0);
      document.getElementById("output").textContent = `Unicode code point: ${codePoint}`;
    }
  </script>
</body>
</html>

Le code fourni utilise une fonction JavaScript appelée "codePointAt()" pour convertir les caractères en points de code Unicode correspondants. Il contient un champ de saisie dans lequel vous pouvez saisir des caractères. Après avoir cliqué sur le bouton "Convertir", le code calculera et affichera les points de code Unicode des caractères saisis. La sortie est affichée dans l'élément de paragraphe avec l'ID "output". Cette fonctionnalité vous permet d'obtenir facilement la valeur du point de code Unicode d'un caractère.

Conclusion

La conversion de caractères en codes ASCII en JavaScript est une opération de base qui a des applications pratiques dans divers scénarios de programmation. Les développeurs peuvent facilement obtenir le code ASCII ou la valeur du point de code Unicode d'un caractère en utilisant des méthodes telles que charCodeAt() et charPointAt(). Que vous ayez besoin de travailler spécifiquement avec des codes ASCII ou avec une gamme plus large de caractères, JavaScript fournit ces méthodes polyvalentes pour vous aider à effectuer une conversion de caractères en ASCII de manière efficace et précise.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer