单击事件不适用于 SVG 中路径的标记结束
Click event does not work on the mark-end of path in SVG
我在 SVG 中创建了一个简单的路径，并使用 mark-end 属性创建了一条箭头线。然后我将点击事件绑定到路径。
我发现点击标记区域时没有触发点击事件。如何解决这个问题？
根据规范，这应该被认为是给定的。
11.6.4 Details on how markers are rendered
[...]
The rendering effect of a marker is as if the contents of the referenced ‘marker’ element were deeply cloned into a separate non-exposed DOM tree for each instance of the marker. Because the cloned DOM tree is non-exposed, the SVG DOM does not show the cloned instance of the marker.
当指针事件发生时，将通过遍历 SVG 的 DOM 树执行命中测试，从而遗漏任何未暴露的阴影 DOM 树。这就是为什么标记实例不可能成为指针事件的目标。
为了澄清，可能需要注意的是，通过 CSS 规则对标记实例进行样式设置时也是如此，这是不可行的。只有原始标记元素，即声明 <marker> 的元素，可以使用 CSS 设置样式，而通过属性 marker-start、marker-mid 或 marker-end 引用的克隆实例无法访问，因此无法单独设置样式。
CSS2 selectors can be applied to the original (i.e., referenced) elements because they are part of the formal document structure. CSS2 selectors cannot be applied to the (conceptually) cloned DOM tree because its contents are not part of the formal document structure.
我在 SVG 中创建了一个简单的路径，并使用 mark-end 属性创建了一条箭头线。然后我将点击事件绑定到路径。
我发现点击标记区域时没有触发点击事件。如何解决这个问题？
根据规范，这应该被认为是给定的。
11.6.4 Details on how markers are rendered
[...]
The rendering effect of a marker is as if the contents of the referenced ‘marker’ element were deeply cloned into a separate non-exposed DOM tree for each instance of the marker. Because the cloned DOM tree is non-exposed, the SVG DOM does not show the cloned instance of the marker.
当指针事件发生时，将通过遍历 SVG 的 DOM 树执行命中测试，从而遗漏任何未暴露的阴影 DOM 树。这就是为什么标记实例不可能成为指针事件的目标。
为了澄清，可能需要注意的是，通过 CSS 规则对标记实例进行样式设置时也是如此，这是不可行的。只有原始标记元素，即声明 <marker> 的元素，可以使用 CSS 设置样式，而通过属性 marker-start、marker-mid 或 marker-end 引用的克隆实例无法访问，因此无法单独设置样式。
CSS2 selectors can be applied to the original (i.e., referenced) elements because they are part of the formal document structure. CSS2 selectors cannot be applied to the (conceptually) cloned DOM tree because its contents are not part of the formal document structure.