[FRAGE] aufbauende Grafik

[DuDeBuddy]

Huhu ihr da draußen,

und zwar ich bin Anfänger und möchte das gerne lernen. Am besten wenn Ihr mir zeigt wie ich sowas machen kann.

Bin gerade an folgendem Thema und zwar würde ich mir gerne ein eigenes Hangmanspiel basteln.
Jetzt ist die Frage wie Baue ich des so mit Java Script auf das bei den falschen Buchstaben ein Bildchen mehr am Hangman auftaucht? Und wie bekomm ich des hin des, sodass mir der Buchstabe von einem underscore in den richtig gedrückten Buchstaben umswitcht?

Es sollte das Deutsche Wort angezeigt werden. Das Englische mit underscors.....

Kann wer mir zeigen wie das geht?

Würde mich freuen.

LG DuDeBuddy

 

[kkapsner]

Was hast du denn schon probiert? Woran hängst du genau?

Prinzipiell is sowas nicht schwer: Für das Bild des Hangman brauchst du einfach verschiedene Bilder für jede Stufe und tauschst dann das .src des <img> immer entsprechend aus. Für zu ratenden Buchstaben würde ich ich einfach jeweils ein separates <span> machen, in das du dann entweder den _ oder den Buchstaben reinschreibst.

 

[paul schmitz]

Bau dir in JS ein Array (oder einen String) mit der aktuellen Zeichenkette, die du regelmäßig nach HTML updatest.
Das gesuchte Wort ist ebenfalls in einer Variable.
Wenn nun ein Buchstabe eingegeben ist, suchst du den im gesuchten Wort und speicherst alle Positionen in einem Array. Das gehst du dann durch und schreibst den Buchstaben in der unvollständigen Zeichenkette hinein. Wenn das array eine Länge von 0 hat, also keine Elemente hat, erhöhst du eine Variable, die die Fehlversuche mitzählt, um 1. Hier kann ebenfalls der Code hin, der die maximale Anzahl der Versuche definiert.
Jetzt gibt es mehrere Möglichkeiten einer grafischen Darstellung. 1, du hast ein Bild namens 0.png, 1.png, 2.png... N.png und updatest im img-Tag den src. 2, du speicherst in einem Array die ASCII-Grafik ab und schreibst die passende (arrayname[fehlversuche]) in einen div. Was du machst, ist dir überlassen.