Get all Attributes from a HTML element with Javascript/jQuery

Question

Hi

I want to put all attributes in a Html element into an array: like i have a jQuery Object, whichs html looks like this:

<span name="test" message="test2"></span>

now one way is to use the xml parser described here, but then i need to know how to get the html code of my object.

the other way is to make it with jquery, but how? the amount of attributes and the names are generic.

Thanks

Btw: I can't access the element with document.getelementbyid or something similar.

Answer 1

if you just want the dom attributes, it's probably simpler to use the attributes nodelist on the element itself:

var el = document.getElementById("someId");
var arr = [];
for (var i=0, attrs=el.attributes, l=attrs.length; i<l; i++){
    arr.push(attrs.item(i).nodeName);
}

Note that this fills the array only with attribute names. If you need the attribute value, you can use the nodeValue property:

var nodes=[], values=[];
for (var attr, i=0, attrs=el.attributes, l=attrs.length; i<l; i++){
    attr = attrs.item(i)
    names.push(attr.nodeName);
    values.push(attr.nodeValue);
}

Answer 2

In javascript:

var attributes;
var spans = document.getElementsByTagName("span");
for(var s in spans){
  if (spans[s].getAttribute('name') === 'test') {
     attributes = spans[s].attributes;
     break;
  }
}

To access the attributes names and values:

attributes[0].nodeName
attributes[0].nodeValue

Answer 3

http://plugins.jquery.com/project/getAttributes