[Javascript] finding an element in the DOM sea

[Jonathan Gold]

Sorry to be thinking out loud here. It was the stylesheet. I'll be
quiter now, promise.

On 1/30/06, Jonathan Gold <johnnyclock at gmail.com> wrote:
> Oh oh! Let me take that back; the span elements still won't change
> their background colors even when I've removed the stylesheet command.
> What's up with these SPAN elements? A certain <p> element that had the
> same problem towed the line after I removed the stylesheet background
> color for it. Butnot so these SPANs. Hmmmm.
>
> On 1/30/06, Jonathan Gold <johnnyclock at gmail.com> wrote:
> > Never mind... I think. I found out what was messing up my intention.
> > My style sheet sets the background color for these elements to be
> > white. This is weird. THe only reason I set the background-colors on
> > the separate elements at all was that the CSS-Validator encourages to
> > set the bg color if you have set the color. Here I need to set the
> > color to help the semantic of the page; but it looks like I better not
> > set the background color on the separate elements until Ilearn how to
> > change a style sheet from javascript. ;-)
> >
> > Thanks for your help; it's been fun navigating the DOM anyway.
> >
> > On 1/30/06, Jonathan Gold <johnnyclock at gmail.com> wrote:
> > > Thanks Paul, that is very helpful. But I am still uncertain _what_ to
> > > call things on the page. Really, I just want to know how to address
> > > certain elements. I want the span elements in this case, to allow
> > > their background color to be changed to conform to the rest of the
> > > webpage. I can view the DOM of my page using the FF extension DOM
> > > Inspector. And I find that the node of my span element is named SPAN
> > > and that its parent element is called LI and its parent element is
> > > called UL, then BODY, then HTML, then something called #document. When
> > > I wanted to adjust the background color of the page as a whole, I
> > > simply wrote "document.bgColor = myColor". myColor was a variable that
> > > had already been set as a hex representation of a color. Now I want to
> > > set the background of the span elements to conform. I know this
> > > doesn't work, but just to show what it is I am trying to do, here's a
> > > line I tried:  "document.html.body.ul.li.span.bgColor = myColor;" So
> > > my question is: how do I correctly address Mr. Span so that he will
> > > feel moved to respond to my requests? :~)
> > >
> > > On 1/30/06, Paul Novitski <paul at novitskisoftware.com> wrote:
> > >
> > > >
> > > > You can walk the DOM this way:
> > > > __________________________
> > > >
> > > > HTML:
> > > >
> > > > <ul id="instructions">
> > > >          <li> ... <span class="xxx"> ...
> > > > __________________________
> > > >
> > > > JavaScript:
> > > >
> > > >          // bail if the browser doesn't support the DOM
> > > >          if (!document.getElementById) return;
> > > >          if (!document.getElementsByTagName) return;
> > > >
> > > > // point to the list
> > > > var oUL = document.getElementById("instructions");
> > > >
> > > > // get an array of the SPAN elements within the list
> > > > var aSpans = oUL.getElementsByTagName("span");
> > > >
> > > > // walk the list
> > > > for (var iSpan = 0; iSpan < aSpans.length; iSpan++)
> > > > {
> > > >          // if this span fits your criteria...
> > > >          if (aSpans[iSpan].className && aSpans[iSpan].className == "xxx")
> > > >          {
> > > >                  do something...
> > > >          }
> > > > }
> > > > __________________________
> > > >
> > > > If you've got a whole whack of spans, only a few of which are ones
> > > > you're interested in, you can add the relevant spans you find to an
> > > > array.  Each element of the array will point to an actual span, so
> > > > you can cycle through the array to examine & modify their classNames,
> > > > adjust their styling, etc., to your heart's content.
> > > >
> > > > The if-test I used above:
> > > >
> > > >          if (aSpans[iSpan].className && aSpans[iSpan].className == "xxx")
> > > >
> > > > means, "if the span has a className and if the className is X" to an
> > > > prevent error if a span doesn't have class at all.  As I recall, this
> > > > extra test isn't necessary if you're using regular expressions to
> > > > test the value of the class name.
> > > >
> > > > Paul
> > >
> > >
> > > --
> > > Jonathan
> > > Berkeley, CA
> > > http://home.pacbell.net/jonnygee/
> > >
> >
> >
> > --
> > Jonathan Gold
> > Berkeley, CA
> > http://home.pacbell.net/jonnygee/
> >
>
>
> --
> Jonathan Gold
> Berkeley, CA
> http://home.pacbell.net/jonnygee/
>


--
Jonathan Gold
Berkeley, CA
http://home.pacbell.net/jonnygee/