How do you access a custom XHTML attribute with JavaScript?

Question

I have the following XHTML:

<span id="myid" cus:att="myvalue" xmlns:cus="http://mycompany.com/customnamespace">
</span>

Is it possible to access custom attributes with javascript? I have the element that represents the span. Doing myElement.att doesn't work, and I can't figure out how to specify the namespace?

You will need to specify whether the page is being served as text/html or application/xhtml+xml as the answer will be different. — Alohci
– Alohci, Commented Mar 26, 2009 at 9:04
In text/html the namespace is an illusion and what you have is an attribute with a colon in its name. Annakata's answer works. In application/xhtml+xml the namespace is real. I haven't tested, but I expect you will need to getAttributeNS() to access the attribute. — Alohci
– Alohci, Commented Mar 26, 2009 at 9:36
@Alochi, Thanks, that makes a lot of sense. Write that as an answer and it'll get a vote. — tpower
– tpower, Commented Mar 26, 2009 at 9:57

annakata · Accepted Answer · 2009-03-26 09:32:10Z

5

Normally speaking you can access it directly, i.e. element.attribute but the namespace slightly complicates this to:

element.getAttribute("namespace:attribute") //the nuclear x-browser option

so just to be really really clear, that'll be something like:

document.getElementById('myid').getAttribute('cus:att')

edited Mar 26, 2009 at 9:32

answered Mar 26, 2009 at 9:07

annakata

76k18 gold badges116 silver badges181 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Bogdan Constantinescu Over a year ago

It works, but he has to get to the element before, which doesn't have an ID, nor class, nor name. Using DOM element as "global" isn't a good practice and you might get burned.

tpower Over a year ago

My problem wasn't getting the element but I will add the id to the question.

annakata Over a year ago

@Bogdan - I'm hardly suggesting he does any global anything, I'm just providing the general form under the (correct) assumption that the OP was capable of selecting the element already

Bogdan Constantinescu Over a year ago

@annakata Sure, I didn't say you were wrong, but right about now the answer is very good. +1 :)

tpower Over a year ago

I will accept this answer but there is one thing bugging me. To do this I need to know what alias the author chose for the namespace.

|

Steve Harrison · Accepted Answer · 2009-03-26 11:05:16Z

1

There is a special version of the getAttribute method specifically designed for accessing namespaced attributes: getAttributeNS. With your example XHTML, the following JavaScript code:

document.getElementById("myid").getAttributeNS("http://mycompany.com/customnamespace", "att");

...would return "myvalue".

You can read more about the getAttributeNS method here.

Steve

answered Mar 26, 2009 at 11:05

Steve Harrison

126k17 gold badges89 silver badges73 bronze badges

2 Comments

annakata Over a year ago

getAttributeNS is not supported by IE

bobince Over a year ago

Also won't work when the document is XHTML-served-as-HTML. It takes a proper XML parser to support namespaces.

Collectives™ on Stack Overflow

How do you access a custom XHTML attribute with JavaScript?

2 Answers 2

6 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related