Swapping ID, DOM not being updated?

[Raffles]

Hi, I am using a script to change the id of an element in order to change its appearance and position. I am doing this:

window.onload = function() {
  var d = document.getElementById('<?php echo $where; ?>'); // $where can be left or right
  var f = document.getElementById('move');
    f.onclick = function () {
      if (d.getAttribute('id') === 'left') {
        d.setAttribute('id', 'right');
      }
      else if (d.getAttribute('id') === 'right') {
        d.setAttribute('id','left');
      }
    }

    if (d.getAttribute('id') === 'left') {
      // do things
    }
      
    if (d.getAttribute('id') === 'right') {
      // do other things
    }
  }

Upon clicking, the CSS associated with the new ID is applied, so that works. The problem is that the things in the last two functions are not being applied. It seems like I would have to somehow poke the JS to tell it that the id has been changed and to apply those things. How do I do this? Cheers,

Rafael

[ALL]

well look closer at the code...

it will run thought the last two if's and execute them only when toe window.onload executes which should only be once unless refreshed...

it will not run those two because onload is only ran once...

also... i seggest making the d and f variables globals by putting them outside the onload function.

if you can put this up online and post a link so we can see it to better serve you,
-ALL

[MikeFoster]

I am using a script to change the id of an element in order to change its appearance and position.

Suggestion: Don't change the ID - change the CLASS.

[Raffles]

Right, thanks, I've fixed it. Using it here: http://raffles.awardspace.com/G/ just for fun and to learn some more JS. Unfortunately it's not working seamlessly in IE (when putting it back on the left), can't figure out why.

Mike, why the class and not the id? I chose that because getElementById makes it so easy, whereas there's no such (default) thing as getElementsByClassName.

EDIT: Just realised I can still use getElementById and then use setAttribute('class')... hopefully this is the best thing to do.

[MikeFoster]

Hi Raffles,

It looks like you have it figured out

I just use IDs for uniquely identifying elements. CLASS was intended for assignment of styles.

Here's my xGetElementsByClassName, and here's two more handy ones: xAddClass and xRemoveClass.

[Raffles]

That is very cool, nice work. I had never heard of X before. How is it different to prototype, which seems to have exploded in popularity recently?

[MikeFoster]

Thanks.

To be honest, I haven't looked under the hood of Prototype