直接写a[href]即可选中所有带href属性的a标签，无论值为#、/about或href=""；而[href]会误匹配link等非a元素，a[href^="https://"]严格匹配https协议开头，a[href$=".pdf"]有效但a[href$="?id=1"]需加引号否则失效。
怎么用 a[href] 选中所有带 href 的 a 标签
直接写 a[href] 就行，这是最基础也最安全的写法。它不关心 href 值是 #、/about 还是空字符串 href=""，只要属性存在就匹配。别写成 [href]——那会把 <link href="style.css"> 也拉进来，样式可能意外污染非链接元素。
a[href^="http"] 和 a[href^="https://"] 区别在哪
前者匹配以 http 开头的所有值，包括 http:// 和 https://；后者只认准双斜杠开头的完整协议。如果你只想高亮真正的 HTTPS 外链，必须写 a[href^="https://"]。写成 a[href^="https:"] 会误中 https:/path（少一个斜杠）这类拼写错误，但浏览器通常会自动补全，CSS 选择器却不会宽容——它做的是严格字符串前缀匹配。
为什么 a[href$=".pdf"] 能用，但 a[href$="?id=1"] 会失效
CSS 属性选择器对属性值不做 URL 解码或逻辑解析，只做原样字符串比对。PDF 后缀 .pdf 是合法标识符，不加引号也能安全解析；但 ?id=1 含特殊字符 ? 和 =，必须加引号：a[href$="?id=1"]。漏掉引号会导致整个规则被浏览器忽略，且不报错——这是最常被忽略的静默失效点。
想排除空 href 或 JS 伪链接？小心这些边界情况
a[href]:not([href=""]):not([href="#"]) 看似合理，但会漏掉：href="javascript:void(0)"、href="tel:+8613800138000"、href="mailto:test@example.com"。真正可控的做法是显式列出要处理的类型，比如只给外链加图标：a[href^="http"]:not([href*="yoursite.com"])。记住：属性选择器只看 HTML 属性是否存在、值是否匹配，它完全不知道这个链接最终能不能跳转，也不知道 JS 后续会不会重写 href。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
