nicht angemeldet
Gunnar Bittersmann
Gunnar Bittersmann
Gunnar Bittersmann
JürgenB
JürgenB
Der Martin
Der Martin
Ich habe folgenden Code:
var jpgdatei = bilddatei;
</script>
<div style="position: absolute;left: 00px;top: 10px">
<img src="../jpg/aachen.jpg" alt="Aachen" title="Aachen" border="0" width="396" height="550" vspace="10" >
</div>
Jetzt soll aber in der Quelle das Wort "aachen" durch die Variable 'bilddatei' ersetzt werden (oder halt eben direkt durch die Variable 'bilddatei).
Wie kann ich das anstellen?
@@mpwfg41
Ich habe folgenden Code:
var jpgdatei = bilddatei; </script> <div style="position: absolute;left: 00px;top: 10px"> <img src="../jpg/aachen.jpg" alt="Aachen" title="Aachen" border="0" width="396" height="550" vspace="10" > </div>Jetzt soll aber in der Quelle das Wort "aachen" durch die Variable 'bilddatei' ersetzt werden (oder halt eben direkt durch die Variable 'bilddatei).
Wie kann ich das anstellen?
Wo kommt der Wert der Variablen bilddatei her? Wird der serverseitig bestimmt oder clientseitig?
Was ist der passende Alternativtext für das Bild bilddatei? Wo kommt der her? (Da wird ja dann vermutlich nicht „Aachen“ passen, oder?)
LLAP 🖖
@@gunnar bittersmann,
in der Datei ist eine Tabelle mit einer Liste aller Städte und weiterer Angaben. Die aufrufende Seite übergibt mit ?Index = x den Index zu dieser Tabelle. Die Angaben zu ALT und TITEL können ganz entfallen oder durch eine allgemeine Angabe ersetzt werden.
@@mpwfg41
in der Datei ist eine Tabelle mit einer Liste aller Städte und weiterer Angaben.
In welcher Datei?
Die Angaben zu ALT und TITEL können ganz entfallen oder durch eine allgemeine Angabe ersetzt werden.
title kann ganz entfallen; sollte wohl auch.
alt nicht. Und da sollte sicher keine allgemeine Angabe drinstehen, sondern eine zum Bild passende.
LLAP 🖖
@@Gunnar Bittersmann,
also das ist ja nun nicht dir Frage.
Welche Datei?
Die html-Datei, in der das Bild eingefügt werden soll.
Unter "Alt" könnte auch stehen: "Dies ist ein Bild zu der von Ihnen gewünschten Stadt" Das passt zu jeder Stadt, im übrigen steht in jedem Bild ganz groß der Name der entsprechenden Stadt,weshalb ich mir um ALT keine große Sorgen mache. Um zur eigentlichen Frage zurückzukehren: Wie kann in 'img src' eine Variable eingefügt werden?
freundlichst
Manfred
Tach,
Wie kann in 'img src' eine Variable eingefügt werden?
https://wiki.selfhtml.org/wiki/JavaScript/DOM/node/setAttribute
mfg
Woodfighter
@@woodfighter
https://wiki.selfhtml.org/wiki/JavaScript/DOM/node/setAttribute
Das Wichtigste (hier das einzig Wichtige) auf dieser Seite ist der Abschnitt „Beachten Sie“:
„Das Setzen von Attributen über setAttribute() ist meist unnötig umständlich.“
„Sie brauchen setAttribute() … nicht.”
LLAP 🖖
Tach,
https://wiki.selfhtml.org/wiki/JavaScript/DOM/node/setAttribute
Das Wichtigste (hier das einzig Wichtige) auf dieser Seite ist der Abschnitt „Beachten Sie“:
jup, allerdings ist da auch beschrieben, wie es geht und ich habe spontan keine andere Beschreibung der Eigenschaften von HTML-Objekten im DOM (ohne Beispiel steht es auch auf https://wiki.selfhtml.org/wiki/JavaScript/DOM/HTML-Elementobjekte#Eigenschaften_und_Methoden_von_HTML-Elementobjekten) gefunden.
mfg
Woodfighter
@@woodfighter
jup, allerdings ist da auch beschrieben, wie es geht und ich habe spontan keine andere Beschreibung der Eigenschaften von HTML-Objekten im DOM
Im MDN. Und da gibt’s auch ein Beispiel.
Anstatt new Image() bzw. document.createElement('img') muss hier freilich das schon bestehende Elementobjekt genommen werden – wie ich schon sagte.
LLAP 🖖
@@mpwfg41
Welche Datei?
Die html-Datei, in der das Bild eingefügt werden soll.
Aha, also in der HTML-Datei „ist eine Tabelle mit einer Liste aller Städte und weiterer Angaben.“
Und wie sieht diese „Tabelle“ aus? Ein JSON-Objekt? Oder wie soll man sich die vorstellen?
Unter "Alt" könnte auch stehen: "Dies ist ein Bild zu der von Ihnen gewünschten Stadt" Das passt zu jeder Stadt, im übrigen steht in jedem Bild ganz groß der Name der entsprechenden Stadt,weshalb ich mir um ALT keine große Sorgen mache.
??? Der Alternativtext ist für diejenigen, die keine Bilder sehen können. Also auch nicht den Schriftzug der entsprechenden Stadt, selbst wenn er ganz groß sein sollte.
Deshalb gehört der Name der jeweiligen Stadt ins alt-Attribut.
Um zur eigentlichen Frage zurückzukehren: Wie kann in 'img src' eine Variable eingefügt werden?
Indem du dir das Elementobjekt des img aus dem DOM suchst und dessen Eigenschaften src und alt mit den Werten aus deiner „Tabelle“ füllst.
LLAP 🖖
@@ Alle Helfer,
vielen Dank für Eure umfassenden Infos. Jetzt verstehe ich einiges mehr, wenn auch noch nicht alles. Dafür habe ich die Lösung für mein Problem gefunden; wie heißt es so schön: "lörning bei duing"
<div style="position: absolute;left: 00px;top: 10px">
<script type="text/javascript">
document.write("<img src ='"+ jpgdatei +"' alt = '"+ort+"' width='396' height ='550'>");
</script>
</div>
Gefunden unter Linkbeschreibung
@@Gunnar Bittersmann
Die Tabelle sieht folgendermaßen aus:
<script type="text/javascript">
var orte = new Array(40);
for (var i = 0; i < orte.length; ++i)
{orte[i] = new Array(3);
}
orte[1][ 1]="06.08!3d 50.78 "; orte[2][ 1 ]="aachen" ; orte[3] [ 1 ]="Aachen";
orte[1][ 2]="12.44!3d 50.99 "; orte[2][ 2 ]="bad hersfeld" ; orte[3] [ 2 ]="Bad Hersfeld";
// hier fehlen natürlich die Zeilen 3 bis 33
orte[1][34]="10.54!3d 52.16 "; orte[2][34 ]="wolfenbüttel" ; orte[3] [34 ]="Wolfenbüttel";
// bei Erweiterung der Liste Tabellengröße prüfen
</script>
Die Tabelle habe ich in Excel erstellt und per copy/paste eingefügt. Möglicherweise hätte man die Werte auch direkt aus der Excel-Tabelle auslesen können, aber der Aufwand war mir für diese 34 Zeilen doch zu groß, zumal es um eine einmalige umgrenzte Aufgabenstellung geht.
Den Index liefert
function Werteliste (querystring) { usw.
danach erfogt die Zuweisung der Werte zu den im weiteren Code verwendeten Variablen:
<script type="text/javascript">
koor = orte[1][index];
pdf = orte[2][index];
ort = orte[3][index];
jpgdatei = "../jpg/aachen.jpg";
pdfdatei ="../pdf/"+pdf+".pdf";
wiki ="https://de.wikipedia.org/wiki/"+ort;
</script>
Nun halte ich es für möglich, dass ein Experte über diesen Code die Nase rümpft, aber ich finde ihn optimal 'minimalistisch' und er erfüllt seinen Zweck genau so, wie ich es mir vorgestellt habe.
Ich denke, dass ich bis morgen alles hochgeladen habe. Dann kann man sich das Ganze hier anschauen: Linkbeschreibung Nochmal besten Dank für die Hilfe und herzliche Grüße - oder Helau und Alaaf
Hallo
Die Tabelle sieht folgendermaßen aus:
<script type="text/javascript"> var orte = new Array(40); for (var i = 0; i < orte.length; ++i) {orte[i] = new Array(3); } orte[1][ 1]="06.08!3d 50.78 "; orte[2][ 1 ]="aachen" ; orte[3] [ 1 ]="Aachen"; orte[1][ 2]="12.44!3d 50.99 "; orte[2][ 2 ]="bad hersfeld" ; orte[3] [ 2 ]="Bad Hersfeld"; // hier fehlen natürlich die Zeilen 3 bis 33 orte[1][34]="10.54!3d 52.16 "; orte[2][34 ]="wolfenbüttel" ; orte[3] [34 ]="Wolfenbüttel"; // bei Erweiterung der Liste Tabellengröße prüfen </script>
so wie du das 2D-Array aufgebaut hast, muss der erste Index von 0 bis 39 und der zweite von 0 bis 2 laufen. Aber Javascript ist da großzügig. Wenn die Variable schon ein Array ist, wird die Länge automatisch angepasst.
Gruß Jürgen
@@JürgenB
Hallo, Das mit Zeile/Spalte habe ich jetzt verstanden (Siehe meinen Post an Gunnar Bittersmann).
Bedeutet deine Aussage: "Wenn die Variable schon ein Array ist, wird die Länge automatisch angepasst.", man kann eine Tabelle mit 1 Zeile und 1 Spalte anlegen, dann Werte für x Zeilen mit y Spalten zuweisen und damit ist die Tabelle angepasst?
Das würde mich schon interessieren.
Gruß
Manfred
Hallo
Bedeutet deine Aussage: "Wenn die Variable schon ein Array ist, wird die Länge automatisch angepasst.", man kann eine Tabelle mit 1 Zeile und 1 Spalte anlegen, dann Werte für x Zeilen mit y Spalten zuweisen und damit ist die Tabelle angepasst?
ja, ich lege Arrays mit var a = []; an. Wichtig ist nur, ein 2D-Array als 1D-Array anzulegen, und dessen Elemente wieder als 1D-Arrays anzulegen.
Gruß Jürgen
Hi,
Bedeutet deine Aussage: "Wenn die Variable schon ein Array ist, wird die Länge automatisch angepasst.", man kann eine Tabelle mit 1 Zeile und 1 Spalte anlegen, dann Werte für x Zeilen mit y Spalten zuweisen und damit ist die Tabelle angepasst?
ja, ich lege Arrays mit var a = []; an. Wichtig ist nur, ein 2D-Array als 1D-Array anzulegen, und dessen Elemente wieder als 1D-Arrays anzulegen.
ja, weil es eigentlich nicht ganz korrekt ist, von zweidimensionalen Arrays zu sprechen. Die gibt es in Javascript nicht. Es gibt nur Arrays, deren Elemente ihrerseits wieder Arrays sind.
Allerdings können die Arrays auf der zweiten Ebene durchaus unterschiedlich groß sein oder anders strukturiert sein, was bei echten 2D-Arrays nicht möglich wäre.
So long,
Martin
Hallo,
<div style="position: absolute;left: 00px;top: 10px"> <script type="text/javascript"> document.write("<img src ='"+ jpgdatei +"' alt = '"+ort+"' width='396' height ='550'>"); </script> </div>
bist du dir darüber im Klaren, was du tust? Absolute Positionierung hat viele Stolpersteine, und ich könnte mir vorstellen, dass das Ergebnis nur "zufällig" das ist, was du haben möchtest.
Außerdem: Wozu das div-Element, wenn sein einziger Inhalt ein Bild ist? Da könntest du ebensogut das Bild selbst positionieren und das Containerlement entsorgen. Es sei denn, es hätte noch einen Zweck, der aus diesem Ausschnitt nicht erkennbar ist.
<script type="text/javascript"> var orte = new Array(40); for (var i = 0; i < orte.length; ++i) {orte[i] = new Array(3); } orte[1][ 1]="06.08!3d 50.78 "; orte[2][ 1 ]="aachen" ; orte[3] [ 1 ]="Aachen"; orte[1][ 2]="12.44!3d 50.99 "; orte[2][ 2 ]="bad hersfeld" ; orte[3] [ 2 ]="Bad Hersfeld"; // hier fehlen natürlich die Zeilen 3 bis 33 orte[1][34]="10.54!3d 52.16 "; orte[2][34 ]="wolfenbüttel" ; orte[3] [34 ]="Wolfenbüttel"; // bei Erweiterung der Liste Tabellengröße prüfen </script>
Hmm. Mysteriös.
[...] zumal es um eine einmalige umgrenzte Aufgabenstellung geht.
Dann nimm meine Vorschläge und Anregungen wenigstens als Denkanstoß für künftige Projekte.
Nun halte ich es für möglich, dass ein Experte über diesen Code die Nase rümpft
So hätte ich es nicht gesagt, aber man kann eben einiges "schöner" machen.
So long,
Martin
@@Der Martin
Hallo,
für deine Hinweise bin ich sehr dankbar; hinzulernen ist ja nicht verboten. Aber einiges zur Erklärung:
Den Aufbau des Arrays habe ich aus einem Beispiel in diesem Wiki
<script> var a = new Array(4);
for (var i = 0; i < a.length; ++i) { a[i] = new Array(10); }
a[3][1] = "Hallo";
alert(a[3][1]);
</script>
Ich habe dieses Beispiel so interpretiert, dass die Tabelle 10 Zeilen mit 4 Spalten enthalten soll. Ich wollte mir nicht vorstellen, dass die Tabelle 4 Zeilen und 10 Spalten haben sollte. Wäre das Beispiel wie folgt, gäbe es keine Zweifel:
<script>
var spalte, zeile;
var Tabelle = new Array(4);
for (var spalte = 0; spalte < tabelle.length; ++spalte) { tabelle[spalte] = new Array(10); }
zeile = 3
spalte= 1
tabelle[zeile][spalte] = "Hallo";
alert(tabelle[zeile][spalte]);
</script>
Die Anordnung (Tabelle[zeile][spalte]) kenne ich auch von einer Programmiersprache, in der ich viele Tausend Codezeilen geschrieben habe. Dort war auch der Index '0' verboten, weshalb ich es hier auch so gehandhabt habe. Der Verlust einer Zeile war mir dabei bewusst. Nachdem mein Tabellenaufbau funktioniert hat, war ich der Meinung, alles sei richtig. Jetzt weiß ich es besser.
Zur Groß- bzw.Kleinschreibung der Ortsnamen: Deine Aussage ist richtig, aber
kannte ich den Befehl zur Umschreibung von Groß- zu Kleinschreibung nicht,(Danke für den Link !)
gibt es bei den Namen der Dateien, die aufgerufen werden, weitere Unterschiede, so dass ich der Einfachheit halber 2 Spalten angelegt habe.
Zur gemeimnisvollen Spalte 'koor'
Ja, das ist tatsächlich eine geogr. Koordinate. Sie wird in einem Link zum Aufruf einer GoogleMap-Karte benötigt. Sie wird in einen endlos langen String eingesetzt, der im Prinzip wie folgt aufgebaut ist:
"blablabla usw usw" + Längengrad + "!3d" + Breitengrad + "blablablabla usw"
Da ich die ganze Tabelle ohnehin außerhalb erstellt habe erschien es mir einfacher, Längengrad + "!3d" + Breitengrad in einem einzigen String zusammenzufassen; alternativ hätte die Tabelle eine Spalte mehr haben müssen. Für manche Dinge gibt es halt verschiedene Wege.
Zu den Div's
Ganz einfach: Ich weiß es nicht besser.
Dass die absolute Positionierung bei unterschiedlichen Bildschirmauflösungen zu Problemen führen kann ist mir klar.
Ich überlege mir, das zu ändern, auch die Divs
Beste Grüße
Manfred
Mahlzeit,
für deine Hinweise bin ich sehr dankbar; hinzulernen ist ja nicht verboten.
nein, im Gegenteil. Wir lernen alle fast täglich dazu. Hoffentlich. :-)
Den Aufbau des Arrays habe ich aus einem Beispiel in diesem Wiki
Weißt du noch, wo genau das steht?
<script> var a = new Array(4); for (var i = 0; i < a.length; ++i) { a[i] = new Array(10); } a[3][1] = "Hallo"; alert(a[3][1]); </script>Ich habe dieses Beispiel so interpretiert, dass die Tabelle 10 Zeilen mit 4 Spalten enthalten soll. Ich wollte mir nicht vorstellen, dass die Tabelle 4 Zeilen und 10 Spalten haben sollte.
Aber genau so (4 Zeilen und 10 Spalten) interpretiere ich den Code, der zugegebenermaßen ohne Kommentare und Erläuterungen nicht wirklich wertvoll ist. Das sollte man verbessern, unter anderem deshalb frage ich nach der genauen Quelle.
Die Anordnung (Tabelle[zeile][spalte]) kenne ich auch von einer Programmiersprache
Ja, so würde ich das auch anordnen bzw. verstehen. Und damit hätte das Wiki-Beispiel, das du oben zitiert hast, eben 4 Zeilen (Index 0 bis 3).
Dort war auch der Index '0' verboten, weshalb ich es hier auch so gehandhabt habe. Der Verlust einer Zeile war mir dabei bewusst.
Das ist ja auch nicht weiter schlimm. Aber was für eine Programmiersprache war das? Denn das Zählen ab 0 ist eigentlich in sehr vielen Sprachen typisch.
Zur Groß- bzw.Kleinschreibung der Ortsnamen: Deine Aussage ist richtig, aber
kannte ich den Befehl zur Umschreibung von Groß- zu Kleinschreibung nicht,(Danke für den Link !)
gibt es bei den Namen der Dateien, die aufgerufen werden, weitere Unterschiede, so dass ich der Einfachheit halber 2 Spalten angelegt habe.
Wenn Groß- und Kleinschreibung nicht das einzige Kriterium ist, okay. Das ging aber aus deinem Beispiel nicht hervor, so dass es für mich wie überflüssige, redundante Information aussah.
Zur gemeimnisvollen Spalte 'koor'
Ja, das ist tatsächlich eine geogr. Koordinate. Sie wird in einem Link zum Aufruf einer GoogleMap-Karte benötigt. Sie wird in einen endlos langen String eingesetzt
Und nicht von dir selbst verarbeitet oder interpretiert? Gut, dann ergibt diese Art der Speicherung vielleicht Sinn.
Für manche Dinge gibt es halt verschiedene Wege.
Natürlich. Erinnert mich an eine Aufgabe in einer Informatik-Klausur am Gymnasium (lang ist's her). Ich weiß nicht mehr, wie die Aufgabe genau lautete, aber man sollte irgendeinen Lösungsweg zunächst als Flussdiagramm und dann in BASIC formulieren (nur auf dem Trockenen, also nur auf Papier).
Als der Lehrer die korrigierten Klausuren wieder zurückgab, meinte er zu mir: "Wissen Sie, Martin, ich habe Ihren Lösungsweg nicht verstanden. Aber ich hab ihn ausprobiert, er funktioniert tatsächlich, und ich weiß nicht, wieso. Ich habe Ihnen deshalb die volle Punktzahl für die Aufgabe gegeben."
Gut, das war in den 80er-Jahren, als die Teenager auf der Heimcomputer-Welle geschwommen sind, und die Bezeichnung "Informatik" für den Kurs war ein grenzenloser Euphemismus. Und der Lehrer kannte sich mit der Materie auch nicht wirklich aus; er war eigentlich Mathe- und Physiklehrer, und im Kollegium hieß es wahrscheinlich: "Irgendjemand muss es ja machen." ;-)
Zu den Div's
Ganz einfach: Ich weiß es nicht besser.
Ähm, was jetzt? Dass man jedes beliebige Element formatieren und positionieren kann?
Dass die absolute Positionierung bei unterschiedlichen Bildschirmauflösungen zu Problemen führen kann ist mir klar.
Nicht nur das. Es ist auch für Anfänger oft nicht leicht zu verstehen, worauf sich denn die Koordinaten bei absoluter Positionierung beziehen. Bei dir ist es vermutlich das Browserfenster. Vermutlich, weil ich davon ausgehe, dass das Element keine Vorfahrenelemente hat, die ebenfalls absolut oder relativ positioniert sind. Das meinte ich mit "zufällig".
So long,
Martin
@@ Der Martin
Hallo,
Also wir sind uns weitgehend einig. Bei der Episode "..... es funktioniert, aber ich weiß nicht warum" musste ich lachen.
Der Link mit der Beschreibung der Array-Erstellung
"0" = unzlässiger Index für ein Array:
Es handelte sich um ein von der Firma WANG (im damaligen Jargon: Wo Andere Noch Grübeln) angepasstes BASIC - 70er Jahre. Lief auf sog. BLACK-BOX, sog. Mittlere Datentechnik (1 Dicke schwarze Kiste, x dumme Fernseher mit Tastatur, Drucker mit 36-Adern-Kabeln (Parallele Schnittstelle), Fest/Wechselplatten-Laufwerk mit 10 MB (!!) = 50 kg, 64k-Byte (!) Anwenderspeicher für 4 Terminals, darauf wurde Finanz- und Lohnbuchhaltung, Auftragsbearbeitung, Arbeitsvorbereitung und Lagerverwaltung gemacht.
In den 90ern wurde die Sprache von der Firma Niakwa übernommen und unter NPL (Niakwa Programing Language) auf PC portiert und vermarktet.
Das mit der unzulässigen Null hatte auch Vorteile. Wenn man also irgenwo einen Index ausgelesen hat und das Ergebnis war "0" führte das zwangsläufig zum Fehler. Man war also gezwungen, vor jedem Zugriff zu einer Tabelle zu prüfen, ob der Index nicht "0" war und dann entsprechende Maßnahmen ergreifen. Man muss verstehen, dass mit diesem System große Datenbanken einschließlich Plattenzugriffen auf Sektor-Ebene Statement für Statement manuell programmiert werden musste, also kein SQL oder etwas ähnliches. Waren das Zeiten.
Gruß
Manfred
Hallo,
Bei der Episode "..... es funktioniert, aber ich weiß nicht warum" musste ich lachen.
dann haben wir ja schon ein gutes Etappenziel erreicht.
Der Link mit der Beschreibung der Array-Erstellung
Linkbeschreibung
Ach da. Danke.
Okay, der Code an sich enthält tatsächlich keine Kommentare. Aber der Text beschreibt IMO deutlich genug, was da passiert, so dass ich nun nicht mehr der Ansicht bin, dass man da nachbessern müsste: "Das Beispiel definiert zunächst ein Array a mit 4 Elementen."
Ob man diese 4 Elemente nun als Zeilen oder Spalten auffassen mag, sei jedem selbst überlassen; ich würde aber zu den Zeilen tendieren, wenn ich mir die entstehende Datenstruktur so vorstelle.
Es handelte sich um ein von der Firma WANG (im damaligen Jargon: Wo Andere Noch Grübeln) angepasstes BASIC - 70er Jahre.
BASIC war auch für mich die erste Programmiersprache, die ich überhaupt gelernt habe - in den frühen 80er Jahren. Das war die Zeit, in der "alle einen Computer hatten, nur ich nicht". Zu Weihnachten 85 habe ich mir dann von ein paar lieben Verwandten Geld schenken lassen, selbst vom Sparbuch noch was draufgelegt und mir "endlich" einen C64 geleistet. Den habe ich aus Nostalgie immer noch, und als ich ihn zuletzt vor schätzungsweise drei Jahren mal wieder aus dem Schrank geholt habe, funktionierte er sogar noch. :-)
Ich erinnere mich übrigens diffus, dass Array-Indexe auch in BASIC ab 0 zählen. Mit der Anweisung
DIM A(10)
erzeugte man ein Array mit 11 (ja, 11) Elementen, die von 0 bis 10 indiziert waren.
Das mit der unzulässigen Null hatte auch Vorteile. Wenn man also irgenwo einen Index ausgelesen hat und das Ergebnis war "0" führte das zwangsläufig zum Fehler. Man war also gezwungen, vor jedem Zugriff zu einer Tabelle zu prüfen, ob der Index nicht "0" war und dann entsprechende Maßnahmen ergreifen.
Klar, aber das Problem hat man im Grunde genommen in jeder Programmiersprache: Überall müssen Daten auf Gültigkeit und Plausibilität überprüft werden. Die Tatsache, dass 0 ein ungültiger Wert ist, kann ein Vorteil beim Debuggen sein, weil nicht initialisierte Variablen häufig den Anfangswert 0 haben und logische Fehler deshalb vielleicht eher auffallen.
So long,
Martin