如何使用jsDom-node.js操作svg？

我有以下

svg

文件

FileName:

seatLayout.svg

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="800px" height="600px" viewBox="0 0 800 600" enable-background="new 0 0 800 600" xml:space="preserve">
  <g id="111">
     <rect x="130" y= "130" height="320" width="550" id="rect1" fill ="white" stroke="blue" >       </rect>
  </g>
</svg>

我曾试图用它来实现。但它不起作用

 jsdom.env('seatLayout.svg', function (errors, window) {
    if(!errors){
       console.log(window.document.getElementById("rect1"));
    }
 });

问题 它记录的是整个窗口对象，而不是

rect

元素

是否可以使用操作svg

---

任何建议都将不胜感激

希望您正在查看您的

rect1

的

innerHTML

<强>注释： Robert Longson指出了一些<代码> SVG < /> >标签，如<代码> <代码>不能是<代码> <代码>的孩子，所以您需要考虑这些代码，如<代码> SVG < /代码>。我不擅长SVG，但下面是Node.js代码，它执行所需的操作。

Node.js代码：

var strSVG = '<?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="800px" height="600px" viewBox="0 0 800 600" enable-background="new 0 0 800 600" xml:space="preserve">  <g id="111"> <rect x="130" y= "130" height="320" width="550" id="rect1" fill ="white" stroke="blue" >       </rect>  </g></svg>'
var strYourText = 'Hello';
var jsdom = require("jsdom");

jsdom.env({
        html : strSVG, 
        done : function (errors, window) {
            window.document.getElementById("rect1").innerHTML = strYourText;
            console.log(window.document.getElementsByTagName('html')[0].innerHTML); 
        }
    }
);

---

你知道

不可能是

的孩子，是吗？@RobertLongson谢谢你的指点。我举了一个圆圈的例子。它可以是任何元素。我已经用text.Erm更新了我的问题。。嗯，

也不能是

的孩子。

var strSVG = '<?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="800px" height="600px" viewBox="0 0 800 600" enable-background="new 0 0 800 600" xml:space="preserve">  <g id="111"> <rect x="130" y= "130" height="320" width="550" id="rect1" fill ="white" stroke="blue" >       </rect>  </g></svg>'
var strYourText = 'Hello';
var jsdom = require("jsdom");

jsdom.env({
        html : strSVG, 
        done : function (errors, window) {
            window.document.getElementById("rect1").innerHTML = strYourText;
            console.log(window.document.getElementsByTagName('html')[0].innerHTML); 
        }
    }
);

var node = document.doctype;
var html = "<!DOCTYPE "
         + node.name
         + (node.publicId ? ' PUBLIC "' + node.publicId + '"' : '')
         + (!node.publicId && node.systemId ? ' SYSTEM' : '') 
         + (node.systemId ? ' "' + node.systemId + '"' : '')
         + '>';

node.name      # Holds the name of the root element, eg: HTML / html
node.publicId  # If this property is present, then it's a public document type.
               #>Prefix PUBLIC
!node.publicId && node.systemId
               # If there's no publicId, but a systemId, prefix SYSTEM
node.systemId  # Append this if present