yessirnosir
asked on
determine all defined image object attributes
Is there a way to enumerate all attributes associated with an image, or for that matter the attributes associated with any other element in a web page? I know I can access attributes if I specify them, eg. the source of an image as document.images[0].src, or the width as document.images[0].width, but what if I want to list every attribute? Have attached a little code below where I loop through every image in a page, and identify each of four attributes. But rather than explicitly naming the attributes I want (which in some cases finds attributes undefined, like useMap for image 2), is there a way to write an inner loop, from attribute = 0 to (number of defined attributes), similar to the way the outer loop is from 0 to (number of images)? That way the code could generically be applied to any object, without naming the specific attributes.
<html>
<head>
<title>Enumerate Image Attributes</title>
</head>
<body >
<img src="image1.jpg" usemap="#Map1" name="Image1" width="400" height="240" border="0" id="Image1" />
<img src="image2.jpg" name="Image2" width="200" height="120" border="0" id="Image2" />
<SCRIPT LANGUAGE="JavaScript">
for(i=0;i<document.images.length;i++)
{
alert("image "+ i + " source is "+document.images[i].src);
alert("image "+ i + " id is "+document.images[i].id);
alert("image "+ i + " width is "+document.images[i].width);
alert("image "+ i + " map is "+document.images[i].useMap);
}
</SCRIPT>
</body>
</html>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
I used to have a dom inspector plugin for IE that was a lot of help some versions back but it stopped working in IE 6. Tried a few javascript debuggers but havent really found one that suits me yet. Usually I just code what I think will work and then test it. If it doesn't work I fiddle with it till it works ;-)
In regards to "attributes.length" I guess any collection (images, elements...) has this property but I could of course be mistaken.
In regards to "attributes.length" I guess any collection (images, elements...) has this property but I could of course be mistaken.
ASKER
Thanks again bluV11t... now that you've set me on the right track I was more successful googling and did find some documentation, eg. http://developer.mozilla.org/en/DOM/element.attributes
Then I also discovered that the attributes "collection" is handled very differently in IE vs other browsers. In IE6 all the undefined values are included in the attributes array as nulls, so while my test code under Firefox, Safari, or Opera only generates only 7 alerts for the first image, under IE6 it generates 99!
Anyway, thanks for helping me along my learning curve.
Then I also discovered that the attributes "collection" is handled very differently in IE vs other browsers. In IE6 all the undefined values are included in the attributes array as nulls, so while my test code under Firefox, Safari, or Opera only generates only 7 alerts for the first image, under IE6 it generates 99!
Anyway, thanks for helping me along my learning curve.
ASKER