Listen von Knoten
Mehrere Attribute
Auf der vorherigen Seite wurden der a Funktion zwei Listen
übergeben. Diese enthielten jeweils nur ein Element.
Bei Bildern reicht ein einzelnes Attribut oft nicht aus:
main =
img
[ src "https://kurzelinks.de/morsegrafik"
, width 300
, alt "Morsecode"
]
[]
Der DOM-Teilbaum lässt sich so darstellen:
HTML
Wir erzeugen den DOM-Baum mit Hilfe von Elm, nicht mit HTML. Zur Verdeutlichung aber hier der HTML-Code, der die gleiche Wirkung hätte:
<img src="https://kurzelinks.de/morsegrafik" width="300" alt="Morsecode">
Aufgabe 1
Ersetze in deinem Projekt den Link durch das Bild gemäß dem Code oben.
Ergänze ähnlich dem Lückentext auf der vorherigen Seite:
-
imgist eine ... -
srcist eine ... -
widthist eine ... -
altist eine ...
Mehrere Textknoten
Analog kannst du mehrere Textknoten in einer Liste erzeugen:
main =
div []
[ text "MORSEN"
, text " "
, text "-- --- ·-· ··· · -·"
]
Der erzeuge DOM-Teilbaum hat folgende Gestalt:
HTML
Wir erzeugen den DOM-Baum mit Hilfe von Elm, nicht mit HTML. Zur Verdeutlichung aber hier der HTML-Code, der die gleiche Wirkung hätte:
<div>
MORSEN
-- --- ·-· ··· · -·
</div>
Aufgabe 2
Teste auch diese Variante.
