我有以下代码：
<div style="height: 100%; width: 70%; margin-left: 15% !important;">
<object id="svg" type="image/svg+xml" data="test1.svg" class="img-responsive" style="height: 100%; width: 100%;">
</object>
</div>
在我的html页面中插入外部svg。
因为我需要通过Id访问每个svg路径，所以我需要使用嵌入式svg来执行此操作。对？但是，如果我只是将svg代码复制并粘贴到我的object标记中，我会得到不同的结果。但它应该是一样的。我需要更改什么才能获得相同的结果？ （稍后svg将加载Ajax）
链接到svg文件：https://www.dropbox.com/s/z09mibjcwbikh3s/test1.svg?dl=0
答案 0 :(得分：0)
不应将SVG代码放入object标记，而是将其完全替换为内联SVG：
<div style="height: 100%; width: 70%; margin-left: 15% !important;">
<svg id="svg8" class="img-responsive" style="height: 100%; width: 100%;" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="75.248mm" width="123.93mm" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 123.93211 75.24752">
<defs id="defs2">
<clipPath id="clipEmfPath1" clipPathUnits="userSpaceOnUse">
<path id="path10" d="m9.9116 3.8368h469.69v285.52h-469.69z"/>
</clipPath>
</defs>
<g id="layer1" transform="translate(175.36 -102.89)">
<g id="g139" transform="matrix(.26458 0 0 .26458 -178.17 101.73)">
<path id="path16" d="m30.934 50.757v141.64h33.572v-141.64z" fill-rule="evenodd" fill="#ffffff"/>
<path id="path18" d="m30.934 50.757h33.572v141.64h-33.572z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path20" d="m459.21 192.4v81.371h-428.28v-81.371z" fill-rule="evenodd" fill="#ffffff"/>
<path id="path22" d="m459.21 192.4v81.371h-428.28v-81.371z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path24" d="m425.8 50.757v141.64h33.41v-141.64z" fill-rule="evenodd" fill="#ffffff"/>
<path id="path26" d="m425.8 50.757h33.41v141.64h-33.41z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path28" d="m459.21 5.0358v45.721h-428.28v-45.721z" fill-rule="evenodd" fill="#ffffff"/>
<path id="path30" d="m459.21 5.0358v45.721h-428.28v-45.721z" clip-path="url(#clipEmfPath1)" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path32" d="m64.506 219.1v42.364h212.94v-42.364z" fill-rule="evenodd" fill="#4472c4"/>
<path id="path34" d="m64.506 219.1h212.94v42.364h-212.94z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path36" d="m338.35 219.1v42.364h87.446v-42.364z" fill-rule="evenodd" fill="#4472c4"/>
<path id="path38" d="m338.35 219.1h87.446v42.364h-87.446z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path40" d="m277.45 234.76v26.378h26.378v-26.378z" fill-rule="evenodd" fill="#000000"/>
<path id="path42" d="m277.45 234.76h26.378v26.378h-26.378z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path44" d="m310.86 234.76v26.378h26.538v-26.378z" fill-rule="evenodd" fill="#000000"/>
<path id="path46" d="m310.86 234.76h26.538v26.378h-26.538z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path48" d="m75.536 50.757v12.31h337.95v-12.31z" fill-rule="evenodd" fill="#7030a0"/>
<path id="path50" d="m75.536 50.757h337.95v12.31h-337.95z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path52" d="m450.26 107.67v46.84h8.9524v-46.84z" fill-rule="evenodd" fill="#000000"/>
<path id="path54" d="m450.26 107.67h8.9524v46.84h-8.9524z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path56" d="m30.294 107.67v46.84h8.7926v-46.84z" fill-rule="evenodd" fill="#000000"/>
<path id="path58" d="m30.294 107.67h8.7926v46.84h-8.7926z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path60" d="m64.506 206.95v12.15h212.94v-12.15z" fill-rule="evenodd" fill="#ffffff"/>
<path id="path62" d="m64.506 206.95h212.94v12.15h-212.94z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path64" d="m75.536 204.71v42.364h7.6735v-42.36z" fill-rule="evenodd" fill="#000000"/>
<path id="path66" d="m75.536 204.71h7.6735v42.364h-7.6735z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path68" d="m338.35 206.95v12.15h87.446v-12.15z" fill-rule="evenodd" fill="#ffffff"/>
<path id="path70" d="m338.35 206.95h87.446v12.15h-87.446z" stroke="#000000" stroke-miterlimit="8" stroke-width="1.2789px" fill="none"/>
<path id="path72" d="m12.15 131.89c0 6.2747 5.0457 11.35 11.27 11.35 6.2247 0 11.27-5.0757 11.27-11.35 0-6.2647-5.0457-11.35-11.27-11.35-6.2247 0-11.27 5.0857-11.27 11.35z" fill-rule="evenodd" fill="#92d050"/>
<path id="path74" d="m12.15 131.89c0 6.2747 5.0457 11.35 11.27 11.35 6.2247 0 11.27-5.0757 11.27-11.35 0-6.2647-5.0457-11.35-11.27-11.35-6.2247 0-11.27 5.0857-11.27 11.35" clip-path="url(#clipEmfPath1)" stroke="#000000" stroke-miterlimit="8" stroke-width="3.0374px" fill="none"/>
<path id="path76" d="m454.82 133.01c0 6.2747 5.1157 11.35 11.35 11.35 6.2747 0 11.35-5.0757 11.35-11.35 0-6.2347-5.0757-11.35-11.35-11.35-6.2347 0-11.35 5.1157-11.35 11.35z" fill-rule="evenodd" fill="#92d050"/>
<path id="path78" d="m454.82 133.01c0 6.2747 5.1157 11.35 11.35 11.35 6.2747 0 11.35-5.0757 11.35-11.35 0-6.2347-5.0757-11.35-11.35-11.35-6.2347 0-11.35 5.1157-11.35 11.35" clip-path="url(#clipEmfPath1)" stroke="#000000" stroke-miterlimit="8" stroke-width="3.0374px" fill="none"/>
<path id="path80" d="m279.44 275.53c0 6.2347 5.0957 11.27 11.35 11.27 6.2747 0 11.35-5.0358 11.35-11.27 0-6.2148-5.0757-11.27-11.35-11.27-6.2547 0-11.35 5.0557-11.35 11.27z" fill-rule="evenodd" fill="#ff0000"/>
<path id="path82" d="m279.44 275.53c0 6.2347 5.0957 11.27 11.35 11.27 6.2747 0 11.35-5.0358 11.35-11.27 0-6.2148-5.0757-11.27-11.35-11.27-6.2547 0-11.35 5.0557-11.35 11.27" clip-path="url(#clipEmfPath1)" stroke="#000000" stroke-miterlimit="8" stroke-width="3.0374px" fill="none"/>
<path id="path84" d="m315.73 275.93c0 6.2747 5.0957 11.35 11.35 11.35 6.2747 0 11.35-5.0757 11.35-11.35 0-6.2547-5.0757-11.35-11.35-11.35-6.2547 0-11.35 5.0957-11.35 11.35z" fill-rule="evenodd" fill="#92d050"/>
<path id="path86" d="m315.73 275.93c0 6.2747 5.0957 11.35 11.35 11.35 6.2747 0 11.35-5.0757 11.35-11.35 0-6.2547-5.0757-11.35-11.35-11.35-6.2547 0-11.35 5.0957-11.35 11.35" clip-path="url(#clipEmfPath1)" stroke="#000000" stroke-miterlimit="8" stroke-width="3.0374px" fill="none"/>
<path id="path88" d="m233.24 34.611c0 6.2347 5.0957 11.27 11.35 11.27 6.2747 0 11.35-5.0358 11.35-11.27 0-6.2148-5.0757-11.27-11.35-11.27-6.2547 0-11.35 5.0557-11.35 11.27z" fill-rule="evenodd" fill="#92d050"/>
<path id="path90" d="m233.24 34.611c0 6.2347 5.0957 11.27 11.35 11.27 6.2747 0 11.35-5.0358 11.35-11.27 0-6.2148-5.0757-11.27-11.35-11.27-6.2547 0-11.35 5.0557-11.35 11.27" stroke="#000000" stroke-miterlimit="8" stroke-width="3.0374px" fill="none"/>
</g>
</g>
</svg>
</div>
然后也应该删除SVG文件中通常存在的XML声明。
该片段中的版本通过另存为＆＃34; Opimized SVG＆＃34;来清理。在 Inkscape，允许自动删除其他清理中的编辑器和元数据。