相关疑难解决方法(0)

假设您有多个SVG标记,其中每个标记都定义了具有相同ID的不同剪辑路径.

<svg id="svg1" width="200" height="200">
    <defs>
        <clipPath id="nodeclipper">
            <rect width="100" height="100" x="0" y="0" />
        </clipPath>
    </defs>
</svg>

<svg id="svg2" width="200" height="200">
    <defs>
        <clipPath id="nodeclipper">
            <circle cx="20" cy="0" r="40" />
        </clipPath>
    </defs>
</svg>

我也做了一个JSFiddle.预期的行为是什么？我认为一个元素只能引用自己的SVG标记内的定义,但似乎并非如此:

• Chrome 26:使用circle剪辑路径两次.
• Firefox 17:使用rect剪辑路径两次.
• Safari 6:按预期渲染一个rect和一个circle剪辑路径.

当你隐藏其中一个SVG标签时会很奇怪,因为Chrome和Safari会clip-path完全掉线.

我知道它有效,当clipPaths有不同的ID,但它应该是这样吗？据我所知,该规范不包含有关该问题的信息.