nicht angemeldet
HTML mit getElementbyid in div ausgeben?
Matthias ApselSchönen guten Sonntag,
ich möchte seit langem aus mit einem <div>-Tag nach belieben per JavaScript HTML Ausgeben die vorher nicht so auf dieser Seite zusehen sind.
Ich habs mt "innerHTML" und "innerText" probiert aber einige Browser haben damit Probleme wie ich gelesen habe genau so wie "document.all". Ich probiere seit längerem "getElementById("element")" für die HTML inklusive style ausgabe. Ich habs mal mit document.write() probiert aber das erziehl nicht wichlich was ich möchte.
Wie krieg ich das am besten einfach hin in einem HTML dokument mit getElementbyid und welche eigenschaften verwende ich da? Ich hab nur gesehen und probiert .innerHTML.
PS.: Wenn es weitere wege gibt die alle gänggen Browser gleichermaßen unterstützen wäre ich dankbar.
Grüße nn
-
Hallo,
innerHTML ist schon ganz richtig. Beispiel:
document.getElementById('foo').innerHTML = '<p>Hallo</p>';Wie sieht dein Code aus, mit dem du es probiert hast?
Grüße
Mathias-
<html> <head> <style type="text/css"> ~~~~~~javascript .screen { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: green; } .row { position: relative; top: 0px; left: 0px; width: 100%; height: 0.4166%; border: 1px solid black; background-color: green; } .dot { position: relative; top: 0px; left: 0px; width: 0.4166%; height: 100%; border: 1px solid black; background-color: blue; } </style> <script type="text/javascript"> function interference() { document.getElementById("empty").innerHTML = "bla"; } ~~~~~~html </script> </head> <body onLoad="javascript:interference();"> <div id="empty" class="screen"></div> </body> </html>so z.b. Ich wolle noch spallten bis zum ende füllen und die spallten mit "dots" wie ich es genannt habe füllen in einer do-while oder for schleife und die dann verändernlassen. spart zeit und arbit und ist übersichtlich. "bla" soll einfach zum testen sein ;-)
-
verdammt! hab den Fehler gefunden :-(! es müsste heißen ...innerHtml = 'bla' und nicht "bla".
danke Dir. Eine frage habe ich doch noch. in der Spezifikation HTML 4.1 interprätieren innerHTML nicht alle Browser. Welchen code muss ich verwenden damit das die gängigen browser interprätieren?-
Hallo,
es müsste heißen ...innerHtml = 'bla' und nicht "bla".
Ob du doppelte oder einfache Anführungszeichen als String-Begrenzer in JavaScript verwendest, ist erst einmal egal. Du musst nur sicherstellen, dass die Begrenzer im String nicht unmaskiert vorkommen, sonst wird der String vorzeitig beendet.
Syntaxfehler:
"<p title="Titel">Hallo</p>"Lösungsmöglichkeiten:
Das jeweils andere Paar für HTML-Attribute usw. verwenden:
"<p title='Titel'>Hallo</p>"
'<p title="Titel">Hallo</p>'Mit einem Schrägstrich davor maskieren, sodass das Zeichen nicht als Begrenzer gewertet wird:
"<p title="Titel">Hallo</p>"
'<p title='Titel'>Hallo</p>'Welchen code muss ich verwenden damit das die gängigen browser interprätieren?
innerHTML wird von allen verbreiteten Browsern unterstützt.
Mathias
-
vielen Dank für deine hilfe.
Jetzt muss ich nur noch hinkrigen dass das per javascrip hinzugefügte html nich wieder neu generiert also ersetzt sonder angefügt wird.function interference() { irow = 0; // ID icol = 0; i = 0; // Value k = 0; /* fullfill rows in the screen */ do { document.getElementById("empty").innerHTML = '<div id="row' + irow +'" class="row" style="top: ' + i +'%;"></div>'; irow++; i = i + 100/240; /* fullfill dots in single row */ do { this_row = "row" + irow; document.getElementById("this_row").innerHTML = '<div id="col' + icol + '_'+ irow'" class="dot" style="left: ' + k +'%;"></div>'; icol++; k = k + 100/240; } while (icol < 240); } while (irow < 240); }tipp?
-
/\* fullfill dots in single row \*/ do { this\_row = "row" + irow; document.getElementById("this\_row").innerHTML = '<div id="col' + icol + '\_'+ irow'" class="dot" style="left: ' + k +'%;"></div>'; icol++; k = k + 100/240; } while (icol < 240);Mit
el.innerHTML = '…'wird der Inhalt mit etwas neuem überschrieben. Dabei wird der bestehende Inhalt gelöscht.Du kannst z.B. erst einen String zusammenbauen, dann am Ende einmal innerHTML setzen:
var str = ''; str += '<div>'; for (var i = 0; i < 10; i++) { str += '<p>' + i + '</p>'; } str += '</div>'; element.innerHTML = str;Es gibt noch andere Möglichkeiten, den DOM-Baum zusammenzubauen, die vielleicht sinnvoller sind:
-
insertAdjacentHTML('beforeend', 'HTML-Code') parst den HTML-Code hängt ihn an das Element an, ohne den Inhalt zu überschreiben.
-
Arbeiten mit den DOM-Methoden auf Elementebene anstatt auf HTML-String-Ebene.
http://de.selfhtml.org/javascript/objekte/document.htm#create_element
http://de.selfhtml.org/javascript/objekte/document.htm#create_text_node
http://de.selfhtml.org/javascript/objekte/node.htm
http://de.selfhtml.org/javascript/objekte/node.htm#append_child
http://de.selfhtml.org/javascript/objekte/htmlelemente.htmMathias
-
jepp hab noch zu lernen. Danke euch bzw Dir!
schönes Wochenende NN
-
-
-
-
-
Om nah hoo pez nyeetz, nn!
»» .row { > position: relative; > top: 0px; > left: 0px; > width: 100%;Einheiten hinter Null sind nicht erforderlich, ebenso wie in diesem Fall die Angaben für top und left, denn da wäre das Element ja sowieso.
Du willst eine Tabelle nachbauen? Warum nimmst du nicht eine?
»» <script type="text/javascript">
function interference() { document.getElementById("empty").innerHTML = "bla"; }Wie findet dein Script heraus, ob das Element leer ist? Es gibt nur genau eines davon? > ~~~html <div id="empty" class="screen"></div>Wenn du vorher schon weißt, dass das Element leer sein wird, kannst du es doch auch gleich füllen.
Leere Elemente lassen sich auch per CSS finden: http://wiki.selfhtml.org/wiki/Empty; den gewünschten Inhalt kannst du ebenfalls per CSS erzeugen: before, after
Vielleicht zeigst du mal, was du tatsächlich vorhast.
Matthias
-
-
-
Liebe(r) nn,
Schönen guten Sonntag,
Du postest dieses am 12.07.2014, das ist aber ein Samstag!
Liebe Grüße,
Felix Riesterer.
--
"Wäre die EU ein Staat, der die Aufnahme in die EU beantragen würde, müsste der Antrag zurückgewiesen werden - aus Mangel an demokratischer Substanz." (Martin Schulz, Präsident des EU-Parlamentes)
