javascript - 事件不在 use 标签内触发

Question

我一直在尝试在 svg 标记中使用 use 标记。它看起来相对简单，我有一个在 JSFiddle 中工作的基本示例:https://jsfiddle.net/cneLLLqu/

单击红色方 block (在 defs 和 use 标记之外)会出现一个消息框。单击绿色方 block 不会触发任何单击事件。我不明白为什么事件会与红色方 block 一起触发，但不会与绿色方 block 一起触发。检查元素一切看起来都很好。

我目前使用的是 Opera 42。

Answer 1

你想做的事情是不可能的。来自 SVG 1.1 规范:

The effect of a ‘use’ element is as if the contents of the referenced element were deeply cloned into a separate non-exposed DOM tree which had the ‘use’ element as its parent and all of the ‘use’ element's ancestors as its higher-level ancestors. Because the cloned DOM tree is non-exposed, the SVG Document Object Model (DOM) only contains the ‘use’ element and its attributes. The SVG DOM does not show the referenced element's contents as children of ‘use’ element.