Niepożądane przestrzenie nazw w znakach SVG przy użyciu XMLSerializer w JavaScript przy użyciu IE

Question

Próbuję użyć interfejsu JavaScript DOM API XMLSerializer, aby przekonwertować element SVG do reprezentatywnego znacznika.

Jest to kod podstawowy służy do tworzenia elementu i szeregować go:

var el = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); 
el.setAttribute('xmlns', 'http://www.w3.org/2000/svg'); 
el.setAttribute('xmlns:xlink', 'http://www.w3.org/1999/xlink'); 

var markup = (new XMLSerializer()).serializeToString(el); 
console.log(markup); 

W Chrome, Firefox, Safari i Opera, produkuje to, co chcę:

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"/> 

ale w Internecie Explorer 9 do IE11, otrzymuję to:

<svg xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xml:NS1="" NS1:xmlns:xlink="http://www.w3.org/1999/xlink" /> 

Występują dwa problemy z wyjściem IE:

1. Istnieją zduplikowane atrybuty xmlns. Jeśli pominę drugą linię kodu JavaScript, to w IE jest tylko jeden atrybut xmlns w znacznikach, ale w przeglądarce Firefox, Chrome, Safari i Opera brakuje tego atrybutu.
2. Dodaje xml:NS1="". Dlaczego to? NS1: jest następnie dodawany do atrybutu xmlns:xlink.

Myślę, że tworzę atrybuty we właściwy sposób. Na przykład użycie setAttribute zamiast setAttributeNS jest tutaj poprawne (more info), a zmiana tego nie rozwiązuje problemu.

Wszelkie doceniane doceny.

Edytuj: a related issue omawia błąd w serializacji Chrome, który prowadzi do pominięcia przestrzeni nazw. Częściowo istotne dla pierwszego problemu (chociaż wszystkie pozostałe przeglądarki działają tak samo), ale nie są związane z drugim problemem.

Answer 1

OK, myślę, że go rozwiązałem. Następnie podążamy szlakiem od this post do tego WebKit bug report i tego test case.

Jeśli zmienić skrypt do tego, to działa:

var el = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); 
el.setAttributeNS('http://www.w3.org/2000/xmlns/', 'xmlns', 'http://www.w3.org/2000/svg'); 
el.setAttributeNS('http://www.w3.org/2000/xmlns/', 'xmlns:xlink', 'http://www.w3.org/1999/xlink'); 

var markup = (new XMLSerializer()).serializeToString(el); 
console.log(markup); 

Ah nazw.

Ale nie działa w starszej wersji WebKit, która jest nadal dostępna w Safari 6.05 i PhantomJS (bug report - teraz rozwiązana). Prawdopodobnie poprawka została włączona do najnowszej aktualizacji Safari (jeszcze nie sprawdziłem).