如何使用CreateSVGRect在SVG文檔中創建樣式矩形？

Question

我試圖創建一個動態構建一個SVG文檔，並希望避免實際編寫<rect ...>等創建SVG文檔後，Chrome顯示它有像createSVGRect(),createSVGPoint()等方法。前者似乎不採取任何參數，並返回SVGRect對象，其屬性僅爲x,y,width和height。

奇怪的是，很難找到有關這些方法的文檔。 MDN指出：

在任何文檔樹之外創建一個SVGRect對象。該對象被初始化，使得所有值都被設置爲0個用戶單位。

它沒有給出任何跡象表明如何應用樣式或將其插入到SVG DOM中。

因此......如果這不是在SVG文檔中創建rect元素的方法，那麼是什麼？

（我需要支持IE9 +）

Answer 1

創建與Document.createElementNS一個SVG元素，所以創造你會寫一個矩形元素。

var rect = document.createElementNS('https://www.w3.org/2000/svg', 'rect'); 

上面創建的對象的類型是一個SVGRectElement。

一個SVGRect對象不是一個SVG元素，它只是被某些SVG DOM方法傳入或返回的東西，例如， getBBox。