[Javascript] Something better than getElementById

Terry Riegel riegel at clearimageonline.com
Mon Oct 24 11:02:01 CDT 2005


Paul,

I was able to implement your first suggestion, but I am not clear on  
how to implement the method that avoids inline scripting. Here is my  
simplified test page that isn't working. Any Ideas on what I might be  
missing?

Terry


<html>
<head>
<style>
  .sel     {padding-top: 3px; padding-bottom:3px; padding-left: 10px;  
padding-right: 10px; margin: 0; color: white; background: #3875D7;}
  .selpub  {padding-top: 3px; padding-bottom:3px; padding-left: 10px;  
padding-right: 10px; margin: 0; color: white; background: #3875D7;}
  .selpri  {padding-top: 3px; padding-bottom:3px; padding-left: 10px;  
padding-right: 10px; margin: 0; color: white; background: #3875D7;}
  .nor     {padding-top: 3px; padding-bottom:3px; padding-left: 10px;  
padding-right: 10px; margin: 0;}
  .norpub  {padding-top: 3px; padding-bottom:3px; padding-left: 10px;  
padding-right: 10px; margin: 0; color: black;}
  .norpri  {padding-top: 3px; padding-bottom:3px; padding-left: 10px;  
padding-right: 10px; margin: 0; color: #777777;}
</style>
<script language="JavaScript">
<!--
function changestate(evt)
{
    // cancel event-bubbling
    if (evt) { event = evt; }
    event.cancelBubble = true;


    // change class
    if (this.className.search('nor') == -1)
     {
       this.className=this.className.replace('sel','nor');
     }
    else
     {
       this.className=this.className.replace('nor','sel');
     }
}

function Initialize()
{
     div.onclick = changestate;
}




//-->
</script>



</head>
<body onload="Initialize()">
  <div class="nor" id=".TEMP">.TEMP</div>
  <div class="nor" id="images">images</div>
  <div class="nor" id="skel">skel</div>
  <div class="nor" id="users">users</div>
  <div class="norpri" id="archive.pak">archive.pak</div>
  <div class="norpub" id="authenticate.html">authenticate.html</div>
</body>
</html>


Thanks for any help.

Terry


On Oct 22, 2005, at 2:53 AM, Paul Novitski wrote:

> At 05:08 PM 10/21/2005, Terry Riegel wrote:
>
>> The only reason I need to getElementById is to set the background
>> color to indicate the link is selected. Is there a way to set an
>> attribute without looking up the id? I am looking for ways to speed
>> up my pages, some have hundred's of ID's.
>>
>
> Terry,
>
> You can pass references to the objects themselves instead of their  
> ids:
>
>         <tag onclick="doSomething(this);">
> ...
>         function doSomething(argObject)
>         {
>                 argObject.className = "selected";
>         }
>
> If you prefer to avoid inline scripting, as I do, you can  
> accomplish the same thing this way:
>
>         function Initialize()
>         {
>                 ...
>                 oObject.onclick = doSomething;
>         }
>
>         function doSomething(evt)
>         {
>                 // cancel event-bubbling
>                         if (evt) { event = evt; }
>                 event.cancelBubble = true;
>
>                 // change class
>                 this.className = "selected";
>         }
>
> Peter-Paul Koch has some good tutorials on event processing in  
> javascript at http://www.quirksmode.org/
>
> Regards,
> Paul
> _______________________________________________
> Javascript mailing list
> Javascript at LaTech.edu
> https://lists.LaTech.edu/mailman/listinfo/javascript
>

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20051024/c203bba4/attachment.htm>


More information about the Javascript mailing list