get all img elements in all divs where class=test

[simbo67]

hi there i am pretty new to javascript, and i am trying my hardest to make this work.

what i have so far:

if (!document.myGetElementsByClassName) {
document.myGetElementsByClassName = function(className) {
var children = document.getElementsByTagName('*') || document.all;
var elements = new Array();

for (var i = 0; i < children.length; i++) {
var child = children;
var classNames = child.className.split(' ');
for (var j = 0; j < classNames.length; j++) {
if (classNames[j] == className) {
elements.push(child);
var dooreflections = elements.getElementsByTagName('img');
break;
}
}
}
return dooreflections;
}
}

and then:


function addReflections() {
var rimages = document.myGetElementsByClassName('test');
for (i=0;i<rimages.length;i++) {
var rheight = null;
var ropacity = null;

var classes = rimages.className.split(' ');
for (j=0;j<classes.length;j++) {
if (classes[j].indexOf("rheight") == 0) {
var rheight = classes[j].substring(7)/100;
} else if (classes[j].indexOf("ropacity") == 0) {
var ropacity = classes[j].substring(8)/100;
}
}

Reflection.add(rimages, { height: rheight, opacity : ropacity});
}
}

my html:

<div class="test"><img src="someimage" /></div>
<div class="notwanted"><img src="someimage" /></div>
<div class="test"><img src="someimage" /></div>

 

[simbo67]

put it in a plain English way:

search the entire document and return every instance of the div with the class "test"
now look at those divs again and check to see if ant contain images.
return all images that reside anywhere within any of the test divs.



is there a way to do this by:
var rimages = document.myGetElementsByTagName('img')
where parentnode = "test";

 

[vacunita]

Somethin like:

var rimages=document.GetElementsByTagName('img');
var x=0;
var divimages=new Array();
var i=0;

for(x in rimages){
if(rimages[x].parentNode.classname=='test' && rimages[x].parentNode.TagName=='div'){
divimages[i]=rimages[x];
i++;
}

}

Once done the divimages array will contain all images that reside inside a DIV with the classname test.

Note: I types this straight into the reply box, so there might be some errors.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.

http://behindtheweb.blogspot.com/

 

[feherke]

Hi

And somewhere in the future we will reduce it to

document[teal].[/teal][COLOR=darkgoldenrod]querySelectorAll[/color][teal]([/teal][green][i]'div.test>img'[/i][/green][teal])[/teal]

[gray]// or[/gray]

document[teal].[/teal][COLOR=darkgoldenrod]evaluate[/color][teal]([/teal][green][i]'//div[@class="test"]/img'[/i][/green][teal],[/teal]document[teal],[/teal][b]null[/b][teal],[/teal]XPathResult[teal].[/teal]ORDERED_NODE_ITERATOR_TYPE[teal],[/teal][b]null[/b][teal])[/teal]

Feherke.

http://free.rootshell.be/~feherke/

 

[simbo67]

thanks guys... i like the look of that somewhere in the future one... why somewhere in the future..?

 

[feherke]

Hi

Because Explorer supports [tt]querySelector()[/tt] and [tt]querySelectorAll()[/tt] only since version 8 and not supports [tt]evaluate()[/tt].

Sadly some people are still using the defunct IE 6.


Feherke.

http://free.rootshell.be/~feherke/

 

[simbo67]

so if im not concerned about ie6 as my website is aimed at mac users , can i use:

document.querySelectorAll('div.test>img')

with success..?

only explorer 6 and below will fail is that correct..?

 

[feherke]

Hi

As far as I know, in Safari [tt]querySelector()[/tt] and [tt]querySelectorAll()[/tt] ar available since version 3.1, released in March 2008.

According to the statistics, almost no Safari user left with version older than 3.

No idea about other Mac browsers, but I would say yes, you can use those methods.

Feherke.

http://free.rootshell.be/~feherke/