svg添加节点类型不匹配 string 转svg用的xml

[langxiaodi]

newRect=document.createElementNS('http://www.w3.org/2000/svg', 'rect');
newRect.setAttribute("x",0);
newRect.setAttribute("y",0);
newRect.setAttribute("width",30);
newRect.setAttribute("height",30);
newRect.setAttribute("stroke","black");
newRect.setAttribute("stroke-width","1");
newRect.setAttribute("fill","white");
SVGDoc.getElementById("ruler").appendChild(newRect);


或者这样
function draw3(svgDoc)
{
alert("123");
newRect=document.createElement(" rect ");
newRect.setAttribute("id","rect3")
newRect.setAttribute("x",0);
newRect.setAttribute("y",0);
newRect.setAttribute("width",200);
newRect.setAttribute("height",200);
newRect.setAttribute("stroke","black");
newRect.setAttribute("stroke-width","1");
newRect.setAttribute("fill","green");
SVGDoc.appendChild(newRect);
alert("chenggong");
}

我这么写 还说我不对
错误提示
JavaScript 运行错误 类型不匹配
为什么啊

另外问下 string 怎么转为svg 用的xml
例如xmlstring= <g id='line'> <line x1='10' y1='"+start+"' x2='10' y2='"+end+"' stroke='black' stroke-width='1' /> </g>
xmlstring 是从后台取得string 是正确的
前台得到后怎么转

[langxiaodi]

自顶一个
这么些还是不对
var xmlstring=ResultData.value;
var svgViewer=document.getElementById("svg");
SVGDoc = window.document.getElementById("svg").getSVGDocument();
alert(SVGDoc.getElementById("rect").getAttribute("stroke"));
SVGDoc.getElementById("rect").setAttribute("stroke","green")
SVGDoc.getElementById("ruler").removeChild(SVGDoc.getElementById("rect2"));
var new_node=parseXML(xmlstring,document.getElementById("svg").getSVGDocument());
SVGDoc.getElementById("ruler").appendChild(new_node);
alert(SVGDoc.getElementById("line").getAttribute("stroke"));

[langxiaodi]

谢谢楼上 直接传个xmlstring 然后用Node parseXML(String ,document) 已经会了 但是
想直接在JavaScript中写的话就不行了 即1楼的做法 请问为什么
改怎么写

[yagebu1983]

关注。。。
学习。。。

[阿非]

4.2 XML 转换函数

函数名称：String printNode(Node)
支持环境：Adobe SVG Viewer3.0
用途：参数中的node节点解析为字符串。

函数名称：Node parseXML(String ,document)
支持环境：Adobe SVG Viewer3.0；Batik1.5.1
用途：将字符串解析成一个节点对象。

这一对函数用于进行字符串和DOM节点之间的转换。我们可以使用printNode（）序列化指定节点用于将当前SVG文档中的Node元素生成字符串用于保存为文本文件或提交给远程服务器。相反的我们可以通过parseXML（）将一个字符串用指定的Document解析为一个Node对象，为parseXML（）配置的document参数用于指定解析Node对象的Document；在Adobo SVG Viewer环境下可以不指定document对象，系统会默认用当前SVG文档的Document对象解析字符串。


表7： 将字符串编译成SVG节点并添加到当前SVG文档
function parseAndAddData (string) {
var node = parseXML(string, document);
document.documentElement.appendChild(node);
}

http://www.ibm.com/developerworks/cn/xml/x-svgscript/

[langxiaodi]

up xia

[langxiaodi]

en 在svg中写没有问题 但是在htnl页面写呢
或者 js文件中写 就会有问题 是不是命名空间的事 还会其他什么声明的原因

[阿非]

<?xml version="1.0" encoding="utf-8"?> 
<svg id="svg" width="800" height="600" xmlns="http://www.w3.org/2000/svg"> 
<script language="JavaScript" xlink:href="temp.js" />
<g id="g5" transform="translate(0 80)">
    <text id="txt1" x="16px" y="30px" style="font-size:15" onclick="createRect()">create rect</text>	
</g>
</svg> 

temp.js

function createRect(){ 
var shape = document.createElement("rect");
shape.setAttribute("x", 10);
shape.setAttribute("y", 10);
shape.setAttribute("width",  200);
shape.setAttribute("height",   200);
shape.setAttribute("style", "fill: #eeeeee");
shape.getStyle().setProperty("stroke","red");
shape.getStyle().setProperty("stroke-width","1");
document.getDocumentElement().insertBefore(shape,document.getDocumentElement().firstChild);
} 

[langxiaodi]

newRect.setAttribute("stroke","black");
newRect.setAttribute("stroke-width","1");
恩 好使了
是这里错了吧
还有那些属性需要写成shape.getStyle().setProperty("stroke","red");
这种形式的 有这方面的教程吗？

[阿非]

<?xml version="1.0" encoding="utf-8"?> 
<svg id="svg" width="800" height="600" xmlns="http://www.w3.org/2000/svg"> 
<script> 
<![CDATA[ 
function createRect(){ 
var shape = document.createElement("rect");
shape.setAttribute("x", 10);
shape.setAttribute("y", 10);
shape.setAttribute("width",  200);
shape.setAttribute("height",   200);
shape.setAttribute("style", "fill: #eeeeee");
shape.getStyle().setProperty("stroke","red");
shape.getStyle().setProperty("stroke-width","1");
document.getDocumentElement().insertBefore(shape,document.getDocumentElement().firstChild);
} 

]]> 

</script> 
<g id="g5" transform="translate(0 80)">
    <text id="txt1" x="16px" y="30px" style="font-size:15" onclick="createRect()">create rect</text>	
</g>

</svg> 

[阿非]

http://www.ibm.com/developerworks/cn/xml/x-svgscript/
文章里提到的参考资料

[s32702]

学习一下，还没接触过