调用href为javascript:void(0)的a标签click()返回undefined问题咨询

HTMLElement.click() 方法本身的返回值就是undefined，所以控制台输出这个结果属于正常现象，不代表代码执行报错，问题核心是未触发正确的加载逻辑，常见原因和对应解决方法如下：

• 原因1：事件绑定位置错误 #

  你提供的HTML结构里，加载更多的逻辑ecEvent.moreHistory是绑定在父级div#showMoreHistory256的onclick属性上，而非a标签本身。你触发a标签的点击事件时，要么是a标签的href="javascript:void(0)"阻止了事件冒泡到父元素，要么是a标签本身没有绑定对应处理逻辑，自然无法触发加载。

  对应解决方案：直接触发父元素的点击事件即可
  执行代码：document.querySelector("#showMoreHistory256").click();

• 原因2：选择器未选中目标元素 #

  如果执行上述代码依然无效，先验证选择器是否能正常获取到元素：
  执行代码console.log(document.querySelector("#showMoreHistory256"))，如果输出为null，说明目标元素是页面动态生成的，你执行代码时元素还未渲染到DOM树中。

  对应解决方案：

  • 等页面完全加载完成后再执行代码，比如把代码放在window.onload或者DOMContentLoaded事件的回调函数中
  • 如果是滚动等交互后才生成的元素，可以用setTimeout延时执行，或者用MutationObserver监听DOM变化，等元素挂载后再触发点击

• 原因3：原生click()无法触发绑定的自定义事件 #

  如果是React、Vue等前端框架绑定的事件，或者自定义事件没有监听原生click触发，就需要手动构造鼠标事件分发触发：

  对应代码：

  const target = document.querySelector("#showMoreHistory256");
  // 构造可冒泡的点击事件
  const clickEvent = new MouseEvent('click', {
    bubbles: true,
    cancelable: true,
    view: window
  });
  target.dispatchEvent(clickEvent);
  

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