使用 document.querySelectorAll 获取所有
推荐使用 document.querySelectorAll('a[href]') 来获取链接。该选择器会自动排除没有 href 属性的 元素，例如纯锚点或绑定 JavaScript 的按钮。相比直接使用 'a' 匹配所有 ，这种方法可以避免许多无效操作。
- 选择器
"a[href]"自带过滤功能，避免获取无意义的空链接。 - 示例代码：
const links = Array.from(document.querySelectorAll('a[href]'))
.map(el => el.href);
处理相对路径与绝对路径的转换
这里有一个关键点：el.href 返回的是浏览器解析后的绝对 URL，相比 el.getAttribute('href') 更加可靠。因为 el.href 始终给出完整地址，例如 https://example.com/path/，适合直接跳转或存储；而 getAttribute 返回原始字符串，可能是 /about 或 #section1，需要手动补全为绝对路径。如果需要保留原始的写法（如做静态分析），则使用 getAttribute；一般情况下优先使用 href。
过滤无效链接与重复项
实际页面中常常出现重复链接、空链接、JavaScript 伪协议（如 javascript：void(0)）或邮件链接（mailto:）。可以简单地执行以下过滤：
- 排除空值或仅包含空白字符：
href.trim() === '' - 排除伪协议：
href.startsWith('javascript：') || href.startsWith('mailto:') - 去重可以用
new Set()：
const uniqueLinks = [...new Set(links.filter(href => href && !href.startsWith('javascript：')))]
应对动态加载的内容
如果页面通过 AJAX 或 React、Vue 等框架异步渲染，初始 DOM 可能不包含所有链接。简单的做法是延迟执行，例如使用 setTimeout 或在 DOMContentLoaded 事件后再查询。更稳妥的方案是采用 MutationObserver 监听新增的 节点。对于单页应用，建议在路由切换后主动触发采集逻辑，而非仅依赖页面加载时机。
