[Javascript] Replace element with another element on click

Paul Novitski paul at novitskisoftware.com
Wed Mar 23 09:21:05 CST 2005


I prefer to do as little as possible in javascript and as much as possible 
in CSS:

theObject.className = "hideit";
or
theObject.className = "showit";

What happens when your page is being displayed by a browser with scripting 
disabled?  Perhaps you could build in a backup system that sends the page 
to the server and returns with the desired attributes set.

Cheers,
Paul



At 05:52 AM 3/23/2005, Shawn Milo wrote:
>In this case, I like to put each object in a DIV, and play with the 
>visibility.
>
>Shawn
>
>
>
>Use this:
>
>theObject.style.display = "none";
>or
>theObject.style.display = "block";
>
>
>Do whatever on the onchange() of the checkbox.
>
>Declare one of the objects like this in the HTML:
><div id=weeklyStart style="display:none;">
>put object here
></div>
>
>
>That way, one will be invisible by default.
>
>I have used this to have a retail sales report which has
>monthly, weekly, and daily views all on one page.  When you select
>'weekly,' for example, it makes the start/end week options appear,
>and the month or day boxes disappear. You get the idea.
>
>Shawn
>
>
>
>On Wed, 23 Mar 2005 00:43:38 -0600, Peter Brunone <peter at brunone.com> wrote:
> >
> >         Well, the nice IE way is to use the outerHTML property and just
> > gut the whole thing (it's pretty fast, too).
> >
> >         If that's not an option, you could have both elements at the
> > same point in your code and alternately set their height and width to
> > 0px (I tried display:none but Netscape 7 doesn't support it).
> >
> > Cheers,
> >
> > Peter
> >
> > -----Original Message-----
> > From: javascript-bounces at LaTech.edu On Behalf Of judah
> >
> > I was curious how to replace a element with another element when the
> > user clicks a checkbox. If checkbox is enabled then replace element A
> > with B (erase A). If checkbox is unchecked then replace element B with A
> >
> > (erase B).
> >
> > Best Regards,
> > Judah
> >
> > _______________________________________________
> > Javascript mailing list
> > Javascript at LaTech.edu
> > https://lists.LaTech.edu/mailman/listinfo/javascript
> >
>
>
>--
>Voicemail any time at:
>206-666-MILO
>_______________________________________________
>Javascript mailing list
>Javascript at LaTech.edu
>https://lists.LaTech.edu/mailman/listinfo/javascript





More information about the Javascript mailing list