Heim >Web-Frontend >js-Tutorial >Wie konvertiere ich Zeichen mit JavaScript in ASCII-Codes?

Wie konvertiere ich Zeichen mit JavaScript in ASCII-Codes?

WBOY
WBOYnach vorne
2023-08-29 09:25:021243Durchsuche

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

ASCII, was für American Standard Code for Information Interchange steht, ist eine Methode zur Kodierung von Zeichen durch Zuordnung zu bestimmten numerischen Werten. Auf diese Weise zugewiesene numerische Werte werden ASCII-Codes genannt und werden in Computersystemen häufig zur Darstellung einer Vielzahl von Zeichen verwendet, darunter Buchstaben, Zahlen, Satzzeichen und spezielle Steuerzeichen.

Beispiel 1: Verwendung von charCodeAt()

Der folgende Code veranschaulicht ein Programm, das die Funktion „charCodeAt()“ verwendet, um ein vom Benutzer eingegebenes Zeichen zu empfangen und dann den entsprechenden ASCII-Code für das Zeichen anzuzeigen.

Grammatik

string.charCodeAt(index)

Algorithmus

Schritt 1: Beginnen Sie mit der Deklaration von HTML-Tags.

Schritt 2: Fügen Sie mithilfe von internem CSS einige UI-Funktionen zur Webseite hinzu.

Schritt 3: Erstellen Sie ein Eingabefeld, damit der Benutzer Zeichen eingeben kann.

Schritt 4: Erstellen Sie eine Schaltfläche, die eine Funktion auslöst, die Zeichen in ASCII konvertiert.

Schritt 5: Erstellen Sie das Skript-Tag.

Schritt 6: Deklarieren Sie eine Konvertierungsfunktion innerhalb des <script>-Tags. </script>

Schritt 7: Deklarieren Sie Eingabevariablen, um Benutzereingaben zu erhalten.

Schritt 8: Verwenden Sie die Funktion charCodeAt(), um Zeichen in ASCII-Werte umzuwandeln.

Beispiel

<!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>

Diese integrierte Funktion verwendet eine Zeichenfolge und einen Index als Parameter und gibt den ASCII-Code des Zeichens an diesem Index zurück. Der Benutzer gibt im HTML-Beispiel Zeichen in das Eingabefeld ein. Wenn Sie auf die Schaltfläche „Konvertieren“ klicken, ruft der JavaScript-Code die Zeichen ab, wendet die Funktion charCodeAt() an und zeigt den ASCII-Code auf der Webseite an.

Beispiel 2 – Verwendung von codePointAt()

Die Funktion codePointAt() ist eine inhärente Möglichkeit, Zeichenfolgen in JavaScript zu verarbeiten. Der Unicode-Codepunktwert des Zeichens wird am ermittelten Index genau ermittelt.

In diesem speziellen Code wird es verwendet, um den Unicode-Codepunktwert des Anfangszeichens aus der Benutzereingabe abzurufen und ihn als Ausgabe anzuzeigen.

Grammatik

const codePoint = input.codePointAt(0);

Beispiel

<!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>

Der bereitgestellte Code nutzt eine JavaScript-Funktion namens „codePointAt()“, um Zeichen in die entsprechenden Unicode-Codepunkte umzuwandeln. Es enthält ein Eingabefeld, in das Sie Zeichen eingeben können. Nachdem Sie auf die Schaltfläche „Konvertieren“ geklickt haben, berechnet der Code die Unicode-Codepunkte der eingegebenen Zeichen und zeigt sie an. Die Ausgabe wird im Absatzelement mit der ID „output“ angezeigt. Mit dieser Funktion können Sie ganz einfach den Unicode-Codepunktwert eines Zeichens ermitteln.

Fazit

Das Konvertieren von Zeichen in ASCII-Codes in JavaScript ist ein grundlegender Vorgang, der praktische Anwendungen in verschiedenen Programmierszenarien hat. Mithilfe von Methoden wie charCodeAt() und charPointAt() können Entwickler problemlos den ASCII-Code oder den Unicode-Codepunktwert eines Zeichens ermitteln. Unabhängig davon, ob Sie speziell mit ASCII-Codes oder mit einer größeren Auswahl an Zeichen arbeiten müssen, bietet JavaScript diese vielseitigen Methoden, mit denen Sie die Konvertierung von Zeichen in ASCII effizient und genau durchführen können.

Das obige ist der detaillierte Inhalt vonWie konvertiere ich Zeichen mit JavaScript in ASCII-Codes?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen