Q: looping and finding DIV sections 
Author Message
 Q: looping and finding DIV sections

Is there any way to loop through the document and pull out specific DIV
section.

I have 4 different types (say A, B, C, D) of DIV sections on one page.  Each
type of DIV section in named (id) something like 412A, 232A, 3331A, 932B,
22B, etc.  The numbers before the letter are randomly generated
(effectively)...from XML/XSL (generate-id() function), so I can't use any
simple algorithm to figure out  DIV section names.

I want the user to be able to hit a button (call it button "A"), and toggle
all DIV "A" sections to display or hide.  I know how to do this if I know
the name of the DIV section (hardcoded), but I don't know how to loop
looking for DIV sections with a particular format (in the above case, any
DIV section ending with an "A").

On a similar issue, is there any way to find all the DIV sections that are
contained within another DIV section?  Does IE keep the hierarchy in tact
some place?

<DIV id="12A">first part<DIV id="343B">second part</DIV>some more of part
one</DIV>

Knowing I have DIV "12A", I want to be able to toggle any interior DIV to
hide or display.  Again, I have no way of knowing the interior DIV section
id, or even the number of DIV sections that will be contained under the main
DIV section.

Thanks in advance.



Wed, 23 Jul 2003 12:28:56 GMT  
 Q: looping and finding DIV sections


Fri, 19 Jun 1992 00:00:00 GMT  
 Q: looping and finding DIV sections
The demo page below should help to answer your first question. As for your second question, you can
obtain a collection of all the DIV tags within another DIV by using something like:

var insideTags = document.all.myDivID.all.tags("DIV");

where myDivID is the id of the DIV tag in question. insideTags would be a collection that can be
iterated in array-style, with insideTags[0] being the first DIV tag within the DIV.

<HTML>
<HEAD>
<TITLE>Show / Hide DIV Demo</TITLE>
<STYLE>
BODY {text-align:center; color:tan; background:brown;}
BUTTON {margin-left:40; color:brown; background:tan; border:10px outset tan; cursor:hand;}
BODY,BUTTON {font-weight:bold;}
.hide {display:none;}
</STYLE>
<SCRIPT language="JavaScript">
var randomNumber = function(a,b){return Math.round(Math.random() * (b - a) + a);};
var randomLetter = function(){return String.fromCharCode(randomNumber(65,68));};
function window.onload()
{
    var div = new Object();
    for(var a = 0; a < 99; a++)
    {
        div = document.body.insertBefore(document.createElement("DIV"));
        div.id = randomNumber(1,1000) + randomLetter();
        div.innerText = "My ID is " + div.id + ".";
    }

Quote:
}

function document.onclick()
{
    with(window.event.srcElement)
    {
        if(tagName != "BUTTON") return;
        var letter = value.match(/.$/)[0];
        var div = document.all.tags("DIV");
        for(var a = 0; a < div.length; a++)
            if(RegExp(letter + "$","i").test(div[a].id))
                with(div[a]) className = className ? "" : "hide";
       with(value) value = charAt(0) == "H" ? replace("Hide","Show") : replace("Show","Hide");
    }

Quote:
}

</SCRIPT>
</HEAD>
<BODY>
<FORM>
<BUTTON>Hide A</BUTTON>
<BUTTON>Hide B</BUTTON>
<BUTTON>Hide C</BUTTON>
<BUTTON>Hide D</BUTTON>
</FORM>
</BODY>
</HTML>

| Is there any way to loop through the document and pull out specific DIV
| section.
|
| I have 4 different types (say A, B, C, D) of DIV sections on one page.  Each
| type of DIV section in named (id) something like 412A, 232A, 3331A, 932B,
| 22B, etc.  The numbers before the letter are randomly generated
| (effectively)...from XML/XSL (generate-id() function), so I can't use any
| simple algorithm to figure out  DIV section names.
|
| I want the user to be able to hit a button (call it button "A"), and toggle
| all DIV "A" sections to display or hide.  I know how to do this if I know
| the name of the DIV section (hardcoded), but I don't know how to loop
| looking for DIV sections with a particular format (in the above case, any
| DIV section ending with an "A").
|
|
| On a similar issue, is there any way to find all the DIV sections that are
| contained within another DIV section?  Does IE keep the hierarchy in tact
| some place?
|
| <DIV id="12A">first part<DIV id="343B">second part</DIV>some more of part
| one</DIV>
|
| Knowing I have DIV "12A", I want to be able to toggle any interior DIV to
| hide or display.  Again, I have no way of knowing the interior DIV section
| id, or even the number of DIV sections that will be contained under the main
| DIV section.
|
| Thanks in advance.
|
|



Wed, 23 Jul 2003 18:45:56 GMT  
 Q: looping and finding DIV sections
You the man!

I can't thank you enough.  This was exactly what I was looking for.  Your
example made the light bulb go on, and now I understand how it all works.  I
really appreciate the time you took to respond.



Quote:
> The demo page below should help to answer your first question. As for your

second question, you can
Quote:
> obtain a collection of all the DIV tags within another DIV by using
something like:

> var insideTags = document.all.myDivID.all.tags("DIV");

> where myDivID is the id of the DIV tag in question. insideTags would be a

collection that can be
Quote:
> iterated in array-style, with insideTags[0] being the first DIV tag within
the DIV.

> <HTML>
> <HEAD>
> <TITLE>Show / Hide DIV Demo</TITLE>
> <STYLE>
> BODY {text-align:center; color:tan; background:brown;}
> BUTTON {margin-left:40; color:brown; background:tan; border:10px outset
tan; cursor:hand;}
> BODY,BUTTON {font-weight:bold;}
> .hide {display:none;}
> </STYLE>
> <SCRIPT language="JavaScript">
> var randomNumber = function(a,b){return Math.round(Math.random() * (b - a)
+ a);};
> var randomLetter = function(){return

String.fromCharCode(randomNumber(65,68));};

- Show quoted text -

Quote:
> function window.onload()
> {
>     var div = new Object();
>     for(var a = 0; a < 99; a++)
>     {
>         div = document.body.insertBefore(document.createElement("DIV"));
>         div.id = randomNumber(1,1000) + randomLetter();
>         div.innerText = "My ID is " + div.id + ".";
>     }
> }

> function document.onclick()
> {
>     with(window.event.srcElement)
>     {
>         if(tagName != "BUTTON") return;
>         var letter = value.match(/.$/)[0];
>         var div = document.all.tags("DIV");
>         for(var a = 0; a < div.length; a++)
>             if(RegExp(letter + "$","i").test(div[a].id))
>                 with(div[a]) className = className ? "" : "hide";
>        with(value) value = charAt(0) == "H" ? replace("Hide","Show") :

replace("Show","Hide");

- Show quoted text -

Quote:
>     }

> }
> </SCRIPT>
> </HEAD>
> <BODY>
> <FORM>
> <BUTTON>Hide A</BUTTON>
> <BUTTON>Hide B</BUTTON>
> <BUTTON>Hide C</BUTTON>
> <BUTTON>Hide D</BUTTON>
> </FORM>
> </BODY>
> </HTML>




- Show quoted text -

Quote:
> | Is there any way to loop through the document and pull out specific DIV
> | section.
> |
> | I have 4 different types (say A, B, C, D) of DIV sections on one page.
Each
> | type of DIV section in named (id) something like 412A, 232A, 3331A,
932B,
> | 22B, etc.  The numbers before the letter are randomly generated
> | (effectively)...from XML/XSL (generate-id() function), so I can't use
any
> | simple algorithm to figure out  DIV section names.
> |
> | I want the user to be able to hit a button (call it button "A"), and
toggle
> | all DIV "A" sections to display or hide.  I know how to do this if I
know
> | the name of the DIV section (hardcoded), but I don't know how to loop
> | looking for DIV sections with a particular format (in the above case,
any
> | DIV section ending with an "A").
> |
> |
> | On a similar issue, is there any way to find all the DIV sections that
are
> | contained within another DIV section?  Does IE keep the hierarchy in
tact
> | some place?
> |
> | <DIV id="12A">first part<DIV id="343B">second part</DIV>some more of
part
> | one</DIV>
> |
> | Knowing I have DIV "12A", I want to be able to toggle any interior DIV
to
> | hide or display.  Again, I have no way of knowing the interior DIV
section
> | id, or even the number of DIV sections that will be contained under the
main
> | DIV section.
> |
> | Thanks in advance.
> |
> |



Thu, 24 Jul 2003 14:24:08 GMT  
 
 [ 4 post ] 

 Relevant Pages 

1. getting text from a DIV section

2. three Qs concerning ps and gv

3. Can I select one of two AXObjects to a DIV section?

4. my loop doesn't loop!

5. A Tiny Recipe for Section Numbering

6. Sectioning Picture Onto Several Pages

7. content of noframes section via DOM

8. reading one section of a string

9. Extract sections of delimeted text from postscript file

10. section of .wsh file

11. Andrew - Scripting Encoder needs it's own section

12. WSH Beta section removed

 

 
Powered by phpBB® Forum Software