getElementsByAttribute() for prototype

[Jak-S]

This function will return an array of the elements in a page that contain a certain attribute, you can also give it a value that the attribute has to match, a tag name that the element has to match and a parent element.

I know there are other functions for doing this, but this one is written for use with the prototype JavaScript library, in fact its really just a modified version of the getElementsByClassName() function that’s part of prototype.

document.getElementsByAttribute = function(attribute, value, tagName, parentElement) {
	var children = ($(parentElement) || document.body).getElementsByTagName((tagName || '*'));
	return $A(children).inject([], function(elements, child) {
		var attributeValue = child.getAttribute(attribute);
		if(attributeValue != null) {
			if(!value || attributeValue == value) {
				elements.push(child);
			}
		}
		return elements;
	});
}

Usage is pretty simple, this will return all elements with a width attribute:

document.getElementsByAttribute('width');

This will return the same as above, but only the elements where the attribute value is 200:

document.getElementsByAttribute('width', '200');

This will return the same as above, but only the img elements:

document.getElementsByAttribute('width', '200', 'img');

This will return the same as above, but only the elements that are children of the gallery element:

document.getElementsByAttribute('width', '200', 'img', 'gallery');

[ott]

Great stuff! Very nice. Done deal

[liorean]

I wrote a similar script some time back. Didn't think to add filtering based on tag name though.