【发布时间】：2011-12-13 23:40:26
【问题描述】：
我遇到了与这里相同的问题：jQuery attr() fails to set attribute
很遗憾，提供的解决方案似乎不起作用。
这是我正在使用的代码：
var text = document.createElement("text");
var dayLabel = document.createTextNode("test");
$(text).attr("transform", "rotate(30 0 0)");
$(text).append(dayLabel);
$(svg).append(text);
我不明白的是，当我查看 DOM 树（使用 Safari 的元素检查器）时，我看到该元素设置了 transform="rotate(90 0 0)"，但旋转似乎失败了。
我的 jQuery 文件是最新的（1.7.1），我展示的代码包含在一个“类”中，该类在这段代码中被实例化：
$(document).ready(function() { ... right here ... });
...所以只有在 DOM 准备好时才会执行。
还有，不知道能不能帮上忙……
这段代码有效：
$("#schedule").append('<svg id="test2" xmlns="http://www.w3.org/2000/svg" version="1.1"><text transform="rotate(30 0 0)">blabla</text></svg>');
...但是这个没有：
$("#schedule").append('<svg id="test1" xmlns="http://www.w3.org/2000/svg" version="1.1"></svg>');
$("#test1").append('<text transform="rotate(30 0 0)">blabla</text>');
基本上，它是相同的代码，但分别有 1 步和 2 步。同样，在这两种情况下，Safari 的 DOM 检查器仍然显示相同的内容，即 <text transform="rotate(30 0 0)">blabla</text>，但在第二种情况下，该元素根本不会显示在页面中。
【问题讨论】：
-
您应该在 SVG 命名空间（即使用
document.createElementNS(...,'text')）中创建 SVG 节点（例如<text>）。