2

我有这个问题，我被困了好几天了。我正在尝试将 svg 附加到 DOM。我在其中有自定义命名空间，当它们被添加到 DOM 中并且您尝试获取附加它们的父元素的 innerHTML 属性时，您会使用一些随机命名空间来获取它们。这仅在 IE9 中发生。

例子：

$(document).ready(function () {
 var svg = '<svg xmlns="http://www.w3.org/2000/svg" ns:attr="val" />';
 alert($("div").append(svg).html());
});

输出将是：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:NS1="" NS1:a:b="val" />

知道如何解决吗？我试图定义命名空间，但它不再工作了。这是一个 jsfiddle 链接http://jsfiddle.net/RwNqk/3/

提前致谢。

4

1 回答 1

2

首先，您的 JSFiddle 中有一个 HTML 文档，而不是 XHTML。HTML 没有自定义命名空间，只有 XML/XHTML 有。

其次，您使用的是ns命名空间前缀，而没有定义该命名空间是什么。其他浏览器完全可以工作真是一个奇迹。

第三，即使你解决了这些问题，你（很遗憾）也不能使用 jQuery 使用先前定义的命名空间前缀将元素塞入 DOM：

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:foo="hello"><head>
  <title>Using jQuery to add namespaced attribute</title>
</head><body>
  <div><p foo:bar="yes">one</p></div>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script type="text/javascript"><![CDATA[
    var xhtml = '<p foo:bar="no">two</p>';
    alert($('div').html());
    try{ $('div').append(xhtml); }
    catch(e){ alert(e);          }
  ]]></script>
</body></html>

第一个警报显示自定义命名空间有效：
<p xmlns="http://www.w3.org/1999/xhtml" foo:bar="yes" xmlns:foo="hello">one</p>

第二个警报显示失败：

[Firefox] "An invalid or illegal string was specified"  code: "12"
[Chrome]  Error: SYNTAX_ERR: DOM Exception 12
[IE9]     DOM EXception: SYNTAX_ERR (12)

这与 IE9 或 SVG 无关。它主要与jQuery有关。（您可以.innerHTML在 IE9 和 FF 中设置 DOM 元素，它会按需要工作，但不能在 Chrome 中使用。）

于 2012-08-15T15:42:19.663 回答