无需jQuery：如何通过href开头字符触发执行函数

没问题的，你完全可以基于链接 href 属性的开头内容来判断并执行对应的操作，不过你的示例代码里有几个小细节需要调整，我来帮你修正并给出可行的实现：

首先说下你代码里的小问题：

• window.onload 的写法不对，正确的赋值方式是 window.onload = function() {...}，或者用更推荐的 addEventListener('load', function() {...})
• JavaScript 里检测字符串开头的方法是 startsWith()，不是你写的 beginsWith，这是标准的字符串方法
• 提前获取 href 的时机可能有问题——如果 DOM 还没加载完成就调用 document.querySelector('.title')，很可能拿到 null，导致后续代码报错，所以最好把获取元素的操作放到页面加载完成的回调里

下面是修正后的完整代码：

// 等待页面所有资源加载完成
window.onload = function() {
  // 先获取目标链接元素
  const targetLink = document.querySelector('.title');
  // 先判断元素是否存在，避免报错
  if (!targetLink) {
    console.log('未找到目标链接');
    return;
  }
  
  const linkHref = targetLink.getAttribute('href');
  
  // 检测href是否以"example"开头
  if (linkHref.startsWith('example')) {
    // 这里写你要执行的操作
    console.log('匹配到指定开头，执行操作！');
    // 比如：targetLink.classList.add('highlight');
  }

  // 如果需要匹配更复杂的规则，比如以"example/"开头，也可以用正则表达式
  if (/^example\//.test(linkHref)) {
    console.log('匹配到带路径的开头，执行对应操作！');
  }
};

如果你的页面里有多个带 .title 类的链接，想要逐个检测的话，可以用 querySelectorAll 遍历：

window.addEventListener('load', function() {
  const allTitleLinks = document.querySelectorAll('.title');
  
  allTitleLinks.forEach(link => {
    const href = link.getAttribute('href');
    if (href.startsWith('example')) {
      // 对每个匹配的链接执行操作，比如添加样式
      link.style.color = '#2563eb';
    }
  });
});

这样就能根据 href 的开头部分精准触发你想要的函数操作啦！

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