Toon posts:

[Javascript] Volgorde DOM aanpassen

Pagina: 1
Acties:

Verwijderd

Topicstarter
Gegroet!

Kben al een tijdje aan het zoeken naar hoe je de volgorde van de DOM kunt veranderen.

Wat ik bijvoorbeeld wil doen, is als ik 6 cellen in een tabel heb, nummer 4 en 5 omwisselen.

Ik had gedacht dat dat misschien kon door eerst 4 en 5 in een soort buffer te stoppen, en dan de echte 5 door de buffer van 4 te laten veranderen en 4 door de buffer van 5. Zo dus:

code:
1
2
3
4
Body.tblContentBufferColumn[4] = Body.tblContentColumn[4];
Body.tblContentBufferColumn[3] = Body.tblContentColumn[3];
Body.tblContentColumn[4] = Body.tblContentBufferColumn[3];
Body.tblContentColumn[3] = Body.tblContentBufferColumn[4];


Body is bij mij een object, en tblContentColumn is een array waar alle createelements in zitten.

Als ik het uitvoer, krijg ik geen error, maar ik zie ook niks veranderen aan de tabel.

Bestaat er soms al een DOM functie hiervoor? Ik kon hem namelijk niet vinden..

Gegroet!

[ Voor 6% gewijzigd door Verwijderd op 11-02-2006 14:42 ]


  • wica
  • Registratie: Februari 2002
  • Laatst online: 14-01 16:59

wica

De duivel jacht op me

Ik denk dat je beter cloneNode() en replaceNode() kunt gebruiken.
Dus eerst clone je de 2 Nodes. EN dan over schrijf je ze met replaceNode();

RFC | The Linux Document Project | gentoo.


  • tech-no-logical
  • Registratie: December 2000
  • Laatst online: 17-03 15:41
kijk eens naar de dom-methods removeChild en insertBefore / replaceChild. hier is een voorbeeld :

http://developer.mozilla...._with_appendChild.28...29

Verwijderd

Topicstarter
Ik heb nu dit:

code:
1
2
3
4
5
Body.tblContentBufferColumn[4] = Body.tblContentColumn[4].cloneNode(true);
Body.tblContentBufferColumn[3] = Body.tblContentColumn[3].cloneNode(true);
        
Body.tblContentRow.replaceChild(Body.tblContentBufferColumn[4], Body.tblContentColumn[3]);
Body.tblContentRow.replaceChild(Body.tblContentBufferColumn[3], Body.tblContentColumn[4]);


De 1e keer werkt ie, maar als ik het nog een keer doe (nogmaals omwisselen, zodat hij weer staat op de manier zoals het was) krijg ik deze error:

Error: uncaught exception: [Exception... "Node was not found" code: "8" nsresult: "0x80530008 (NS_ERROR_DOM_NOT_FOUND_ERR)" location: "http://localhost:3661/Gulst_Alpha/Default.aspx Line: 136"]

Hoe kan dat dan ineens?

Verwijderd

Zoals hierboven al geopperd is de DOM Level 2 Core methode insertBefore de enig benodigde methode.

code:
1
Node insertBefore(in Node newChild, in Node refChild) raises(DOMException);

wanneer insertBefore als newChild parameter een Node meekrijgt, zal die node eerst uit de Tree verwijderd worden.

Voor het swappen van twee Nodes kan je de volgende code gebruiken:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script>
window.onload = function () {

  var swapA = document.getElementById('a');
  var swapB = document.getElementById('c');

  var tempAppend = swapB.nextSibling;
  var tempAppendParent = swapB.parentNode;

  swapA.parentNode.insertBefore(swapB, swapA);
  tempAppendParent.insertBefore(swapA, tempAppend);

}

</script>
<body>
  <p id="a">eerste paragraaf</p>
  <p id="b">tweede paragraaf</p>
  <p id="c">derde paragraaf</p>
</body>

Clonen is overbodig

[ Voor 11% gewijzigd door Verwijderd op 11-02-2006 15:51 ]


Verwijderd

Topicstarter
Thanks,

Ik wist niet dat insertBefore ook kon als het object er al stond.. wat ik nu dus heb is dit (wat voor mij werkt omdat ik zelf de variabelen bij houdt):

code:
1
Body.tblContentRow.insertBefore(Body.tblContentColumn[4], Body.tblContentColumn[3]);


Thanks!
Pagina: 1