Javascript – Delete Button

von

wie kann ich einen Button erstellen der einen eingegeben Text löscht?

Um einen Button zu erstellen, der einen eingegebenen Text löscht, benötigst du HTML für die Struktur, evtl. CSS für das Aussehen und JavaScript für die Funktionalität. Hier ist ein einfacher Beispielcode, der das erledigt:

  1. HTML:
<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Text löschen</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <input type="text" id="textInput" placeholder="Geben Sie Ihren Text ein">
    <button id="deleteButton">Löschen</button>
    <script src="script.js"></script>
</body>
</html>
  1. CSS (styles.css):
/* Stil für das Eingabefeld und den Button */
input, button {
    margin: 10px;
    padding: 10px;
}
  1. JavaScript (script.js):
document.addEventListener('DOMContentLoaded', function() {
    // Holen der HTML-Elemente
    const textInput = document.getElementById('textInput');
    const deleteButton = document.getElementById('deleteButton');

    // Eventlistener für den Button hinzufügen
    deleteButton.addEventListener('click', function() {
        // Setzen des Textinhalts des Eingabefelds auf leer
        textInput.value = '';
    });
});

Dieser Code erstellt eine einfache HTML-Seite mit einem Eingabefeld und einem Button. Der JavaScript-Code sorgt dafür, dass der Button, wenn er geklickt wird, den Text im Eingabefeld löscht.

Speichere die Dateien in einem Ordner (z.B. text_loeschen) mit den angegebenen Namen (index.html, styles.css, script.js). Dann kannst du die index.html-Datei in einem Webbrowser öffnen und den Button verwenden, um den eingegebenen Text zu löschen.

Schreibe einen Kommentar