jQuery选择器和$x(xpath)返回的svg元素无法调用click方法如何解决

• 开发者工具内置的$x()方法返回值为匹配XPath规则的元素数组，哪怕仅匹配到1个元素也会用数组包裹，直接对数组调用.click()方法必然触发类型错误
• SVG元素本身不属于HTML原生交互元素，部分场景下未实现HTMLElement的.click()快捷方法，即便取到单个元素直接调用也可能报错

1. 先提取单个目标元素 #

从$x()返回的数组中取下标对应元素，比如取第一个匹配结果写法如下：
const target = $x('替换为你的XPath表达式')[0]

2. 手动派发点击事件（兼容性最高） #

不要调用原生.click()快捷方法，手动构造鼠标点击事件派发给目标元素即可，完整代码如下：

// 获取单个目标元素
const targetEle = $x('替换为你的XPath表达式')[0];
// 构造标准鼠标点击事件
const clickEvent = new MouseEvent('click', {
  bubbles: true,
  cancelable: true,
  view: window
});
// 派发事件触发点击逻辑
targetEle.dispatchEvent(clickEvent);

特殊场景兼容 #

如果目标元素绑定的是行内onclick事件，可以直接调用该属性方法：

const targetEle = $x('替换为你的XPath表达式')[0];
targetEle.onclick && targetEle.onclick();

内容的提问来源于stack exchange，提问作者Adel