document.queryselectorall('a')可一键获取页面所有元素,返回静态nodelist;加[href]可筛选含href属性的链接,再用filter()排除javascript:void(0)、#等无效链接。

可以用 document.querySelectorAll('a') 一键获取页面中所有 <a></a> 元素(即超链接节点)。
使用 querySelectorAll 获取所有 a 标签
这是最常用、最直接的方法,返回一个静态的 NodeList,包含文档中所有匹配的 <a></a> 元素:
const links = document.querySelectorAll('a');- 支持链式调用,比如
links.forEach(link => console.log(link.href)) - 只匹配顶层文档中的
<a></a>,不含 Shadow DOM 内部(如需包含需额外处理)
只获取有 href 属性的有效链接
有些 <a></a> 标签可能没有 href(比如仅用于锚点跳转或 JS 绑定),若只想筛选“真正可跳转”的链接,可以加属性选择器:
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
const validLinks = document.querySelectorAll('a[href]');- 这样会排除
<a>文本</a>这类无 href 的标签 - 注意:
href值为空字符串(href="")也会被选中,如需进一步过滤,可配合.filter()
兼容旧浏览器或需要 HTMLCollection 时用 getElementsByTagName
如果目标环境需要支持 IE8 等老版本,可用传统方法:
const links = document.getElementsByTagName('a');- 返回的是动态的 HTMLCollection,不是数组,使用前建议转成数组:
Array.from(links)或[...links] - 它不支持 CSS 选择器语法,无法直接加
[href]过滤,需手动遍历判断
进阶:排除 JavaScript 伪协议或空链接
实际项目中常需跳过 javascript:void(0)、#、空 href 等无效链接:
const realLinks = Array.from(document.querySelectorAll('a[href]')).filter(link => {const href = link.href.trim();return href && !/^#|javascript:/i.test(href) && !/^$/.test(href);});
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










