如何使用 Javascript 在网站中单击 SVG 的一部分？

Question

Javascript 提供了一种称为click().这例如：<a id="a" href="index.htm">Click here</a>和document.getElementById("a").click();但是 SVG-Elements 呢？<svg>   <g id="a" .....></g> </svg>这行不通：document.getElementById("a").click();我可以成功选择g-Tag，但是没有点击方法：document.getElementById(...).click 不是函数是否可以使用 Javascript 以某种方式单击 SVG-Tag 中的元素？

Answer 1

您可以手动创建和调度事件，例如

document.getElementById("a").dispatchEvent(new Event('click'));

这就是 click() 方法在幕后所做的所有事情。这只是一种方便的方法。

这将适用于任何 SVG 元素，包括<g>元素。

Answer 2

使用dispatchEvent(new Event('click'))如果.click()不工作。请在https://jsfiddle.net/mvqpg930/1/检查小提琴

Answer 3

不完全确定 JavaScript 是否有实际click()事件（我知道它可以插入为：onclick()在 HTML 中）。jQuery 有一个click()事件。也就是说，eventlistener如果您使用的是 JavaScript 而不是 jQuery ，我相信您必须添加一个。

document.getElementById("a").addEventListener('click', function() {

     //do something

});