Question

svg怎么和js交互的

<?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">
<!-- Created by MxD -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" onload="init(evt)" width="190mm" height="120mm" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" viewBox="20 40 217 207" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<style type="text/css">
<![CDATA[
@font-face { font-family:"宋体";src:url("#FontID0") format(svg)}
.str0 {stroke:#0093DD;stroke-width:0.1764}
.str1 {stroke:#0093DD;stroke-width:0.1764}
.fil6 {fill:none}
.fil7 {fill:#0093DD}
.fil9 {fill:#1F1A17}
.fil0 {fill:#C2C1C1}
.fil8 {fill:#DA251D}
.fil4 {fill:#D7EDFB}
.fil3 {fill:#D8ECE0}
.fil2 {fill:#FBE0D5}
.fil1 {fill:#FCE0EC}
.fil5 {fill:#FFFEE2}
.fnt2 {font-weight:normal;font-size:0.6492;font-family:'宋体'}
.fnt0 {font-weight:normal;font-size:3.6198;font-family:'宋体'}
.fnt1 {font-weight:normal;font-size:5.0304;font-family:'宋体'}
]]>
</style>
<style type="text/css" media="screen">
path:hover {fill:yellow;}
</style>

<script type="text/javascript">
<![CDATA[
var svgDoc = null ;
var svgRoot = null ;
var parentWnd = null ; //保存html的window对象
var init;
function init(evt){
//alert("statr");
svgDoc = evt.target.ownerDocument;
svgRoot = svgDoc.documentElement;
parentWnd = window.parent;
svgDoc.svgWnd = window;
//alert("end");
}
]]>

function Detail(evt){
var id=evt.target.id;
document.getElementById(id).className="fil5";
}
<script>

</defs>
<g id="图层_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<g id="_26292160">
<g>
<g>
<path id="xinjiang" onclick="Detail(evt)" class="fil0" d="...">
<path id="hainan" onclick="Detail(evt)" class="fil1" d="...">
<path id="taiwan" onclick="Detail(evt)" class="fil5" d="...">
</g>
</g>
</g>
</g>
</svg>
上面是我的svg，我想执行某个path的onclick后，这一path所描述的区域换一个class，即换颜色，可是试了好多种方法，颜色就是不变，请高手指导指导啊，在线等待。。。

Answer 1

你试试看这样写
<path id="xinjiang" onclick="Detail(evt)" style=“fill:red">

function Detail(evt){
var id=evt.target.id;
document.getElementById(id).getStyle().setProperty('fill','green')
}

我刚试了一下，是可以改变颜色的

Answer 2

发