4 Möglichkeiten zum Drucken in Javascript

Inhaltsverzeichnis:

4 Möglichkeiten zum Drucken in Javascript
4 Möglichkeiten zum Drucken in Javascript

Video: 4 Möglichkeiten zum Drucken in Javascript

Video: 4 Möglichkeiten zum Drucken in Javascript
Video: StackOverflow ist tot, es lebe ChatGPT!? // deutsch 2024, April
Anonim

In der Computerprogrammierung ist Drucken ein Befehl, der verwendet wird, um eine Art von Text auf dem Bildschirm anzuzeigen. Es kann verwendet werden, um Text (String), eine Variable, Zahlen oder mathematische Berechnungen anzuzeigen. Eines der ersten Dinge, die viele Programmierer lernen, ist die Verwendung eines Druckbefehls, um ein Programm zu erstellen, das "Hello World!" anzeigt. Im Gegensatz zu anderen Programmiersprachen wird Javascript in einem Webbrowser gerendert. Javascript hat keinen einfachen Druckbefehl wie viele andere Sprachen. Es gibt jedoch viele Möglichkeiten, Text innerhalb des HTML-Dokuments, eines Warnfensters oder der Konsole anzuzeigen. Sie können auch Javascript verwenden, um von einem Drucker aus zu drucken.

Schritte

Methode 1 von 4: Verwenden von InnerHTML

In Javascript drucken Schritt 1
In Javascript drucken Schritt 1

Schritt 1. Geben Sie <p id= in den Textkörper Ihres HTML-Dokuments ein

Dies ist das öffnende HTML-Tag für Absatztext mit einer bestimmten ID.

Weitere Informationen zum Schreiben von HTML-Code finden Sie unter So erstellen Sie eine einfache Webseite mit HTML

In Javascript drucken Schritt 2
In Javascript drucken Schritt 2

Schritt 2. Geben Sie einen Namen für das Absatzelement in Anführungszeichen gefolgt von > ein

Dadurch wird dem Absatztextelement eine in Javascript abrufbare ID zugewiesen. Zum Beispiel,"

".

Sie können auch andere HTML-Textelemente verwenden, wie z. B. den Header {{kbd|

In Javascript drucken Schritt 3
In Javascript drucken Schritt 3

Schritt 3. Geben Sie ein

unmittelbar nach dem"

Schild.

Dies fügt ein schließendes Tag für das HTML-Element des Anfangsabsatzes hinzu

In Javascript drucken Schritt 4
In Javascript drucken Schritt 4

Schritt 4. Drücke auf ↵ Enter

Dies fügt Ihrem HTML-Code eine neue Zeile hinzu.

In Javascript drucken Schritt 5
In Javascript drucken Schritt 5

Schritt 5. Tippe ein und drücke auf ↵ Enter

Dies ist das öffnende Tag für Ihr Javascript. Alle Javascript-Codierung sollte nach diesem Tag erfolgen.

In Javascript drucken Schritt 6
In Javascript drucken Schritt 6

Schritt 6. Geben Sie document.getElementById ein

Dies ist der Javascript-Code zum Aufrufen eines HTML-Elements anhand seiner ID.

In Javascript drucken Schritt 7
In Javascript drucken Schritt 7

Schritt 7. Geben Sie die ID des Absatzelements in Anführungszeichen in Klammern ein

Wenn Ihr Absatzelement"

", würde Ihr Javascript-Code "document.getElementById("math")" lauten.

In Javascript drucken Schritt 8
In Javascript drucken Schritt 8

Schritt 8. Geben Sie. InnerHTML = nach der Klammer ein

Mit diesem Befehl werden Textausgaben über das HTML-Element angezeigt.

In Javascript drucken Schritt 9
In Javascript drucken Schritt 9

Schritt 9. Geben Sie ein, was Sie drucken möchten, gefolgt von einem Semikolon (;

).

Sie können Text, eine Variable, Zahlen oder eine mathematische Gleichung anzeigen.

Geben Sie beispielsweise "document.getElementById("demo").innerHTML = 27 + 33;" ein. um die Summe von 27 + 33 zu drucken

In Javascript drucken Schritt 10
In Javascript drucken Schritt 10

Schritt 10. Drücke auf ↵ Enter und tippe ein

Dieses Tag schließt Ihren Javascript-Code. Geben Sie dieses Tag ein, wenn Sie alle Ihre Javascript-Zeilen eingegeben haben. Wenn Sie das HTML-Dokument in einen Webbrowser laden, wird es im HTML-Dokument gedruckt.

Methode 2 von 4: Verwenden einer Fensterwarnung

In Javascript drucken Schritt 11
In Javascript drucken Schritt 11

Schritt 1. Geben Sie den Textkörper Ihres HTML-Dokuments ein

Dies ist das öffnende Tag für Ihr Javascript.

In Javascript drucken Schritt 12
In Javascript drucken Schritt 12

Schritt 2. Drücke auf ↵ Enter und tippe alert ein

Dies ist der Javascript-Befehl zum Öffnen einer Popup-Fensterwarnung.

In Javascript drucken Schritt 13
In Javascript drucken Schritt 13

Schritt 3. Geben Sie in Klammern ein, was Sie drucken möchten

Sie können Text, eine Variable, Zahlen oder eine mathematische Gleichung eingeben. Beispiel: "alert("Hallo Süße!")", um "Hallo Süße!" anzuzeigen. in einem Popup-Fenster.

In Javascript drucken Schritt 14
In Javascript drucken Schritt 14

Schritt 4. Fügen Sie ein Semikolon (;

) Am Ende.

Dies schließt Ihre Javascript-Zeile. Die gesamte Zeile sollte ungefähr so aussehen wie "alert("Hello Sweety!");".

In Javascript drucken Schritt 15
In Javascript drucken Schritt 15

Schritt 5. Drücke auf ↵ Enter und tippe ein

Dieses Tag schließt Ihren Javascript-Code. Geben Sie dieses Tag ein, wenn Sie alle Ihre Javascript-Zeilen eingegeben haben. Wenn Sie Ihr HTML-Dokument in einen Webbrowser laden, wird der zu druckende Text in einem Popup-Fenster angezeigt.

Sie können auch eine Schaltfläche erstellen, die gedruckten Text in einem Popup-Fenster anzeigt. Geben Sie dazu "Schaltflächentext" ein

Methode 3 von 4: Konsolenprotokoll verwenden

In Javascript drucken Schritt 16
In Javascript drucken Schritt 16

Schritt 1. Geben Sie den Textkörper Ihres HTML-Dokuments ein

Dies ist das öffnende Tag für Ihr Javascript.

In Javascript drucken Schritt 17
In Javascript drucken Schritt 17

Schritt 2. Drücke auf ↵ Enter und tippe console.log ein

Dies ist der Javascript-Befehl für ein Konsolenprotokoll. Ein Konsolenprotokoll kommt einem Druckbefehl im typischen Codierungssinn am nächsten. Es zeigt keinen Text auf Ihrer Webseite an, aber es zeigt Text in der Konsole an, wenn Sie Ihr HTML/Javascript in einem Webbrowser ausführen. Dies ist zum Debuggen nützlich.

In Javascript drucken Schritt 18
In Javascript drucken Schritt 18

Schritt 3. Geben Sie in Klammern den Text ein, den Sie anmelden möchten

Dies kann Text (eine Zeichenfolge), eine Variable, Zahlen oder eine mathematische Gleichung sein. Zum Beispiel console.log(ich drucke in Javascript).

In Javascript drucken Schritt 19
In Javascript drucken Schritt 19

Schritt 4. Fügen Sie ein Semikolon (;

) Am Ende.

Dies schließt Ihre Javascript-Zeile. Die gesamte Zeile sollte ungefähr so aussehen wie "nowiki>console.log(ich drucke in Javascript)

In Javascript drucken Schritt 20
In Javascript drucken Schritt 20

Schritt 5. Drücke auf ↵ Enter und tippe ein

Dieses Tag schließt Ihren Javascript-Code. Geben Sie dieses Tag ein, wenn Sie alle Ihre Javascript-Zeilen eingegeben haben.

In Javascript drucken Schritt 21
In Javascript drucken Schritt 21

Schritt 6. Speichern Sie Ihr HTML-Dokument

Verwenden Sie die folgenden Schritte, um Ihr HTML-Dokument zu speichern.

  • Klicken Datei oben in Ihrem Texteditor oder HTML-Bearbeitungsprogramm.
  • Klicken Speichern als.
  • Geben Sie einen Dateinamen für das HTML-Dokument ein.
  • Stellen Sie sicher, dass es als ".html"-Dokument gespeichert wird.
  • Klicken Speichern.
In Javascript drucken Schritt 22
In Javascript drucken Schritt 22

Schritt 7. Öffnen Sie das HTML-Dokument in einem Webbrowser

Öffnen Sie einen beliebigen Webbrowser Ihrer Wahl und geben Sie den Dateispeicherort des HTML-Dokuments in die Adressleiste oben ein. Dadurch wird das HTML-Dokument in Ihrem Webbrowser geöffnet.

In Javascript drucken Schritt 23
In Javascript drucken Schritt 23

Schritt 8. Drücken Sie F12

Dadurch wird der Entwicklermodus in Ihrem Webbrowser geöffnet. Sie sehen ein neues Fenster mit angezeigtem HTML-, CSS- und Javascript-Code.

In Javascript drucken Schritt 24
In Javascript drucken Schritt 24

Schritt 9. Klicken Sie auf Konsole

Es befindet sich oben im Entwicklermodusfenster.

In Javascript drucken Schritt 25
In Javascript drucken Schritt 25

Schritt 10. Aktualisieren Sie Ihren Browser

In Javascript drucken Schritt 26
In Javascript drucken Schritt 26

Schritt 1. Geben Sie <button onclick= in den Textkörper Ihres HTML-Dokuments ein

Dies ist das öffnende HTML-Tag, um eine Schaltfläche in Ihrem HTML-Code zu erstellen.

In Javascript drucken Schritt 27
In Javascript drucken Schritt 27

Schritt 2. Geben Sie "window.print()"> nach dem Gleichheitszeichen (=) ein

Der Befehl "window.print()" ist der Javascript-Befehl zum Drucken des Inhalts Ihres Webbrowser-Fensters. Die Klammer (>) beendet das öffnende Tag des HTML-Buttons.

In Javascript drucken Schritt 28
In Javascript drucken Schritt 28

Schritt 3. Geben Sie den gewünschten Text in die Schaltfläche ein

Dies sollte direkt nach der Klammer (>) gehen. Sie könnten beispielsweise "Klicken Sie hier, um zu drucken" oder etwas Ähnliches eingeben.

In Javascript drucken Schritt 29
In Javascript drucken Schritt 29

Schritt 4. Geben Sie ein

Dadurch wird das HTML-Schaltflächenelement geschlossen. Wenn Sie Ihren HTML-Code in einem Webbrowser rendern, wird eine Schaltfläche erstellt, auf die Sie klicken können, um den Inhalt Ihres Webbrowsers zu drucken.

Empfohlen: