[Javascript] div creeeren na onload.

donderdag 23 juni 2011 14:07

Acties:

0 Henk 'm!

Topicstarter

Ik heb, in een htmlpagina, javascript code die wordt aangeroepen met een functie. Deze functie roept weer met window.onload een andere functie aan. Het idee is dat de javascript aan de hand van de locatie van een div zijn positie bepaalt op de pagina. Het is natuurlijk makkelijk om een div in de html te plaatsen, maar door omstandigheden moet de div gecreëerd worden in de javascript.
Het probleem nu is dat de div gemaakt wordt na de onload(dit kan niet anders), wat betekent dat de gehele pagina overschreven wordt met mijn document.write.

Ik vraag mij dus af of iemand een manier weet om de div te plaatsen zonder een document.write. Appendchild heb ik al geprobeerd, maar dan wordt het onderaan de pagina toegevoegd. Er is geen parentdiv.

donderdag 23 juni 2011 14:15

Acties:

0 Henk 'm!

Naranya

Zoiets?

JavaScript:

1
2
3

var parent_div = document.getElementById('parent_div');
var new_div = document.createElement('div');
parent_div.appendChild(new_div);

donderdag 23 juni 2011 14:19

Acties:

0 Henk 'm!

MueR

Admin Tweakers Discord

is niet lief

Je kon niets vinden tussen de 21 miljoen resultaten?

Anyone who gets in between me and my morning coffee should be insecure.

donderdag 23 juni 2011 14:27

Acties:

0 Henk 'm!

Naranya

Je wil dus je div absoluut positioneren?

JavaScript:

1	new_div.setAttribute("style", "position:absolute; left:0; top:0;");

donderdag 23 juni 2011 14:28

Acties:

0 Henk 'm!

McRubz

Bobby Rifler schreef op donderdag 23 juni 2011 @ 14:21:
[...]

Er is geen parentdiv. Dat is nou net het probleem.

Als je stukje javascript de positie van het te injecteren div-je moet bepalen na het laden van de pagina moet er toch wel een parent-element zijn? Gebruik ook geen document.write, maar de functies die hierboven al gegeven worden.

donderdag 23 juni 2011 14:30

Acties:

0 Henk 'm!

nika

Stel je vraag nou eens duidelijk, want blijkbaar wil je iets anders dan mensen hier antwoorden.

Verder kun je natuurlijk ook insertBefore of insertAfter doen als je de DIV geen child wil maken.

donderdag 23 juni 2011 14:42

Acties:

0 Henk 'm!

Bobby Rifler

Topicstarter

Oke maar het komt er dus op neer dat je niks kan plaatsen zonder er een parent is.

donderdag 23 juni 2011 14:45

Acties:

0 Henk 'm!

418O2

jQuery

JavaScript:

var div = $("<div />").attr("id", "testDivje");
div.insertAfter($("#header"));
//of
div.appendTo("body");

je moet hem toch wel érgens in/achter/voor kwijt willen lijkt me

Een versimpeld snippet van je code/html zou wel handig zijn.

[ Voor 13% gewijzigd door 418O2 op 23-06-2011 14:46 ]

donderdag 23 juni 2011 14:46

Acties:

0 Henk 'm!

Naranya

Als jij een element on-the-fly aanmaakt zal je browser toch moeten weten waar hij deze neer moet zetten ja, zie Wikipedia: Document Object Model

donderdag 23 juni 2011 14:49

Acties:

0 Henk 'm!

Bosmonster

*zucht*

Javascript

Het idee is dat de javascript aan de hand van de locatie van een div zijn positie bepaalt op de pagina.

Dan maakt het toch niet uit dat ie in de DOM onderaan de pagina komt? Je moet alleen daarna even hem op zn plek zetten relatief aan die andere div.

Optioneel kun je hem in die div zelf zetten en van daaruit relatief positioneren natuurlijk.

donderdag 23 juni 2011 14:49

Acties:

0 Henk 'm!

Bobby Rifler

Topicstarter

Bedankt voor het meedenken. Dit bevestigd onze conclusie over het probleem. Slotje mag.

donderdag 23 juni 2011 15:12

Acties:

0 Henk 'm!

Caelorum

Bobby Rifler schreef op donderdag 23 juni 2011 @ 14:49:
Bedankt voor het meedenken. Dit bevestigd onze conclusie over het probleem. Slotje mag.

En je conclusie is ook goed? Misschien handig om hem even hier neer te zetten?

donderdag 23 juni 2011 15:16

Acties:

0 Henk 'm!

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

Javascript

Bobby Rifler schreef op donderdag 23 juni 2011 @ 14:49:
Bedankt voor het meedenken. Dit bevestigd onze conclusie over het probleem. Slotje mag.

Een slotje is niet nodig op een topic als je je oplossing hebt. Zie daarvoor ook onze faq betreffende topiceinde.

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Je eigen tweaker.me redirect

Over mij

donderdag 23 juni 2011 16:09

Acties:

0 Henk 'm!

OkkE

CSS influencer :+

Bobby Rifler schreef op donderdag 23 juni 2011 @ 14:42:
Oke maar het komt er dus op neer dat je niks kan plaatsen zonder er een parent is.

Er is altijd een parent, namelijk <body> of <html>.

Maar aangezien je de div met Javascript toevoegd (en ik denk ook absoluut wil positioneren?) maakt het niks uit waar in de DOM (broncode) dit element staat. Je kunt dan ook met Javascript de top, bottom, left & right zetten.

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

donderdag 23 juni 2011 16:30

Acties:

0 Henk 'm!

Verwijderd

Als ik de TS goed begrijp (gezien de vage vraag en antwoorden) is het de bedoeling dat het script een div plaatst op de locatie van het script, maar zonder document.write...

De reden waarom document.write niet kan/mag is mij overigens onduidelijk, omdat deze gewoon iets print en niets overschrijft.

Maar je kunt het volgende doen:
- laad de volledige pagina
- voer script uit
- zoek naar locatie van script (adhv script src)
- plaats daarvoor/-achter de div

Het is een beetje overkill (doc.write werkt hetzelfde, maar dan in 1 regel), maar het zou je limitatie oplossen.

donderdag 23 juni 2011 16:31

Acties:

0 Henk 'm!

418O2

of ram het in een placeholder-div

donderdag 23 juni 2011 16:35

Acties:

0 Henk 'm!

OkkE

CSS influencer :+

Zonder meer informatie is het sowieso onmogelijk om goed advies te geven over wat de beste oplossing is. Als we een testcase hebben, kunnen we misschien nog gericht vragen stellen en verder helpen.

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

Onderwerpen