Easy way to drop XML Namespaces with JavaScript?

Question

Is there an easy way, for example, to drop an XML name space, but keep the tag as is with jQuery or JavaScript? For example:

<html:a href="#an-example" title="Go to the example">Just an Example</html:a>

And change it to:

<a href="#an-example" title="Go to the example">Just an Example</a>

On the fly with jQuery or JavaScript and not knowing the elements and or attributes inside?

Answer 1

This isn't really an answer, but you'd be better off handling this server-side. JavaScript comes into the picture a bit too late for this kind of task... events may have already been attached to the existing nodes and you'd be processing each element twice.

What is the purpose of the namespace?

If these are static html files and the namespace serves no purpose I would strip all the namespaces with a regex.

If they're not static and the namespace has a purpose when served as xml, you could do some server-side detection to serve with the right doctype and the namespace (when appropriate).

Answer 2

It's easy when you know how ... just use \\ to escape the colon so it's not parsed as an action delimiter by the jquery parsing engine.

$('html\\:a').each( function(){
  var temp = $(this).html();
  $(this).replaceWith("<a>"+temp+"</a>");
});

This should iterate between each of those elements and replace them with normal tags. Since these are being served up to an ajax callback function, otherwise I don't see why you'd want to do it on the fly ... then the top line would change to:

$.post('...',{}, function(dat){
    $(dat).find('html\\:a').each( blah blah ....
    .
    .
});

NB, i'm one of those terrible people who only really tests things in FF ...

Answer 3

If there is no <script> tag in the code to be replaced you can try (demo):

container.innerHTML = container.innerHTML
                               .replace(/<(\/?)([^:>]*:)?([^>]+)>/g, "<$1$3>");