createElement in ander Element

[wha]

createElement in ander Element

Ik ben bezig met javascript die het volgende div moet genereren:

HTML:

<div id="msgloader">
<div id="msg">
<div id="naam">Piet</div>
<div id="text">Blaat</div>
</div>
<div id="msg">
<div id="naam">Piet</div>
<div id="text">Blaat</div>
</div>
</div>

JavaScript:

var messagesElement = document.getElementById("msgloader");

var messagesBody = document.createElement("div");
messagesBody.id = "msg";

var leftBody = document.createElement("div");
leftBody.id = "naam";
leftBody.innerHTML = "naam";

var centerBody = document.createElement("div");
centerBody.id = "text";
centerBody.innerHTML = "test";

messagesBody.appendChild(leftBody);
messagesBody.appendChild(centerBody);

messagesElement.appendChild(messageBody);

Wat ik ook geprobeerd heb is de append op de messageBody maar dat werkt ook niet , iemand enige idee?

[ Voor 3% gewijzigd door wha op 22-08-2013 14:47 . Reden: Code benaming in order gemaakt. ]

[Orion84]

"werkt ook niet" is nogal vaag. Wat voor meldingen krijg je in de error console van de browser waar je het in test? Wat is het resultaat en hoe verschilt dat van het verwachtte resultaat?

[CurlyMo]

Ik zou eerst eens aan je consistentie werken.
1) Laat je HTML inspringen zodat je weet hoe de hiërarchie is (dit kan je ook tijdelijk in je JS doen om het voor jezelf overzichtelijk te houden).
2) Je geeft id's aan de nieuwe elementen die niet in je voorbeeld staan zoals msg-left of centerdiv ipv name en text. Als je voorbeeld niet overeenkomst wat je uiteindelijk wilt maken, dan is het lastig helpen.
3) Je gebruikt dezelfde id's meerdere malen wat niet mag in HTML.
4) In je javascript zitten nogal belangrijke fouten zoals messagesElement != msgElement

[ Voor 6% gewijzigd door CurlyMo op 22-08-2013 13:58 ]

[wha]

Klopt dat het nogal vaag is, in de console komt geen foutmelding naar voren en ook geen foutmelding, zowel in Chrome als Firefox laat niks zien.

Het is een verkeerde topic start, je mag deze sluiten ga nog even een paar uur verder puzzelen met de benaming en code optimaliseren.

Bedankt!

[Sleepkever]

wha schreef op donderdag 22 augustus 2013 @ 14:07:
Klopt dat het nogal vaag is, in de console komt geen foutmelding naar voren en ook geen foutmelding, zowel in Chrome als Firefox laat niks zien.

Dat lijkt me sterk. Controleer je variable namen eens.

JavaScript:

var messagesElement = document.getElementById("msgloader"); 

JavaScript:

msgElement.appendChild(leftBody); 

[BtM909]

wha schreef op donderdag 22 augustus 2013 @ 14:07:


Het is een verkeerde topic start, je mag deze sluiten ga nog even een paar uur verder puzzelen met de benaming en code optimaliseren.

Bedankt!

We sluiten niet zondermeer topics. Zie ook: Het algemeen beleid #topiceinde

Daarnaast kan je altijd nog je topicstart aanpassen door middel van Wijzig

[wha]

Heb het probleem inmiddels opgelost, de onderste 3 regels van het script heb ik aangepast naar het volgende waardoor het werkt:
oude:

JavaScript:

messagesBody.appendChild(leftBody); 
messagesBody.appendChild(centerBody); 

messagesElement.appendChild(messageBody);

Het nieuwe:

JavaScript:

messageBody.appendChild(leftBody);
messageBody.appendChild(centerBody);
messagesElement.appendChild(messageBody);

Waarschijnlijk waren het de type fouten en een andere manier gebruik van een functies die het opgelost hebben.

[CurlyMo]

Er is in je tweede deel geen ander gebruik van functies dus de conclusie is dat de fout in je typefouten zat.

Daarnaast had de code in je nieuwe inleiding ook gewerkt dus iemand die dit topic doorleest begrijpt niet echt wat er nu besproken is en hoe het zat met de oplossing. De post van Sleepkever geeft de oude versie van de inleiding weer en dus ook de typefout.