• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] <DIV ID="..."> per JS OnClick mit Variable füllen

I

Insulaner

New member
Hallo JS-Welt!

Wenn einer Samstagnachmittags nix zu tun hat, kommt er auf solch dumme Gedanken:

Ich bastle an einer mehrsprachigen Website, deren Layout über CSS läuft und deren Inhalte (Texte, Bilder, in/externe Links) per jQuery komplett aus separaten TXT-Dateien kommen. Will sich ein Besucher den Quelltext ansehen, bekommt er also nur (für die meisten) kryptischen Code zu lesen. Die Site läut ohne PHP oder andere Server-seitige Techniken und das soll auch so bleiben.

Mein Problem ist bei der bisherigen Version, dass für jeden internen Link die komplette Seite (inklusive Flächen-deckendem Hintergrundbild) geladen werden muss, was gelegentlich zu unschönem Geflacker führt. Es werden gerade mal fünf Seiten aber in vier verschiedenen Sprachen angeboten, was ich bisher so gelöst habe:

Pro Sprache gibt es ein Verzeichnis (DE, EN, CS, CT), in dem ein HTML und ein TEXT-Verzeichnis angelegt ist. Pro Menüpunkt rufe ich also eine HTML-Seite auf, die sich ihre Texte aus "../text/blabla.txt" holt. So habe ich pro Sprache im Moment fünf HTML-Dateien. Zur Pflege editiere ich also eine HTML-Datei, kopiere sie in die parallel liegenden Verzeichnisse der anderen Sprachen und gut ist.

Die Inhalte sind in drei Boxen (HTML/CSS-Boxmodell) positioniert.

Jetzt kommt's: Ich hätte gerne die Möglichkeit pro Sprache genau eine HTML-Seite zu laden und dann die jeweiligen Inhalte per Link aus der selben Seite zu laden. Meine Idee dazu ist bisher, die über DIV ID-Tags angesteuerten Inhalte per Variable aufzurufen. Wenn ich also bisher
<div id="txtA"><div id="_txtA"></div></div>
genutzt habe, wobei "txtA" für die Box und "_txtA" für die aufzurufende TXT.Datei steht, würde ich "_txtA" gerne durch eine Variable ersetzen. Der Aufruf soll nur die Box "txtA" mit einem neuem Inhalt füllen, die Seite aber nicht neu laden.

Gibt es für solch einen Unfug eine sinnvolle Lösung? Ich würde mich freuen!

Sollte meine Beschreibung nicht nachvollziehbar sein, bitte umgehend motzen :))

Vielen Dank vorab!

Sebastel
 
Ih versteh zwar nicht so ganz, was du meinst aber wenn du die id ändern möchtest, sollte dir das hier helfen:
JavaScript/Objekte/DOM/element/setAttribute

Meinst du, dass du alles in ein Verzeichnis, in dem dann die HTML-Datei und die vier Textdateien packen möchtest und dann anhand von Benutzereingaben die id und somit die auszulesende Datei ändern möchtest?
 
Zuletzt bearbeitet:
Hallo Siggi,

Dein erster Absatz scheint mich auf den richtigen Weg zu schicken. Die Änderung des Attributs soll per Klick auf einen Link erfolgen. Ich denke, das müsste sich so realisieren lassen. Mal schauen...

Was die Verzeichnisse betrifft, habe mich mich wohl ein bisschen dusslig ausgedrückt, was aber -sollte Dein Ansatz funktionieren- auch nicht mehr wichtig ist.

Lieben Dank und noch einen schönen Abend!

Sebastel
 
NB: Standardattribute wie id sollte man besser nicht mit setAttribute setzen, sondern direkt:
Code: 
NODE.id = "wasAuchImmer"
Ist kürzer und besser zu lesen.

Aber um Daten nachzuladen, brauchst du die ID eigentlich gar nicht ändern, sondern dir einfach nur die Daten per AJAX holen und dann in das entsprechende <div> schreiben...
 
kkapsner schrieb:
NB: Standardattribute wie id sollte man besser nicht mit setAttribute setzen, sondern direkt:
Code: 
NODE.id = "wasAuchImmer"
Ist kürzer und besser zu lesen.
Zum Vergrößern anklicken....
Danke! Ich wusste bisher gar nicht, dass das so auch geht.


kkapsner schrieb:
Aber um Daten nachzuladen, brauchst du die ID eigentlich gar nicht ändern, sondern dir einfach nur die Daten per AJAX holen und dann in das entsprechende <div> schreiben...
Zum Vergrößern anklicken....
Na ja, ich denke, dass es doch einfacher wäre, sprachenspezifische Id's zu machen und das ganze schon beim Seitenaufruf zu laden, denn Ajax zu implementieren (oder das Ganze mit jQuery zu machen) ist doch etwas schwieriger als einfach die Id neu zu setzen. Zwar verlängert das das Laden der Seite (was aber bei einem nicht zu großen Projekt und nicht allzu langsamen Browser kein Problem darstellen sollte), aber bei deiner Methode muss ja immer wieder nachgeladen werden und man könnte nicht so schnell zwischen den Sprachen hin und her "switchen".
 
Siggi05 schrieb:
Na ja, ich denke, dass es doch einfacher wäre, sprachenspezifische Id's zu machen und das ganze schon beim Seitenaufruf zu laden, denn Ajax zu implementieren (oder das Ganze mit jQuery zu machen) ist doch etwas schwieriger als einfach die Id neu zu setzen.
Zum Vergrößern anklicken....
Ja, aber indem du eine ID neu setzt, wird noch gar kein Text geändert...

Kannst du nicht mal einen Beispiellink geben oder wenigstens etwas Code? Ich verstehen noch nicht ganz, wie dein jetziges System genau funktioniert.
 
Hallo KK, hallo Siggi!

Erstmal Dank für Eure Diskussion! Mir fehlte bis heute die Zeit das Projekt (das ich für einen jungen Kunden schreibe) weiterzuführen und kann erst jetzt antworten.

@kkapsner: Du schreibst "Standard-Attribute <i>sollte</i> man nicht ...". Mit diesem Verb habe ich so ganz ohne Begründung immer so meine Schwierigkeiten. Magst Du das noch erläutern?

@Siggi: Das "switchen" zwischen den Sprachen ist gar nicht so sehr das Thema. Aber um das zu erläutern müsste ich hier seitenlange Texte schreiben.

Ich werde die Seite in einer inhaltlich kastrierten, aber zum Thema kommentierten Version bis heute Abend mal als Demo-Link bereistellen. Vielleicht fällt die Diskussion am "lebenden Objekt" ja leichter ;-)

Bis später!

Sebastel
 
Ich würde anstatt von den Textdateien eine JavaScript-Datei mit den verschieden Sprachen als Variablen speichern:
Code: 
var deutsch = "Dies ist ein deutscher Text";
var englisch = "This is an english text";
Diese werden dann bei Seitenaufruf geladen und können dann beliebig in das Element geschrieben werden.
Code: 
aendern()
{
switch(ELEMENT.id)
{
case "deutsch":
ELEMENT.innerHTML = deutsch;
break;
case "englisch":
ELEMENT.innerHTML = englisch;
break;
}
}
Und hier ändere ich nicht die ID, sondern das HTML im Tag. Und ja, mit ID's ändern allein würde es nicht gehen.
Ist mir erst gerade aufgefallen... :redface-new: :D
 
Damit kann es aber passieren, dass man viel mehr Daten lädt, als man benötigt. Je nach Textlängen kann das durchaus bemerkbar sein.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben