跳转到主内容
新派编程网 - 新潮编程理念,全新技术课堂!

HTML中mark文本高亮技巧 HTML中mark标签在搜索结果中的应用

必须使用实现搜索关键词高亮,因其具备语义可访问性、读屏器明确播报、搜索引擎结构化提取等不可替代优势;禁用,避免嵌套、XSS及中文分词误匹配等问题。 搜索关键词高亮必须用
,不是视觉选择而是语义刚需 辅助技术(如读屏器)会把
明确读作“高亮文本”,而
默认无声无息;搜索引擎也可能单独提取
内容用于摘要或片段生成。如果你在搜索页返回的 HTML 里用
span
替代
,等于主动放弃语义层的可访问性与结构化能力。 常见错误现象: 用户搜 “React”,页面渲染出
React
→ 读屏器不提示“这是匹配词”,盲人用户无法感知搜索命中 服务端返回已带
的 HTML,但前端 JS 又用正则二次包裹 → 出现
React
,嵌套破坏语义且 CSS 难控制 动态插入
时,
innerHTML
是最危险的写法 用户输入的关键词(比如来自 URL 的
q=JS