标签仅用于语义化标记变量名本身，不声明变量、不存值、不参与js运行；适用于数学公式、api路径占位符、函数形参、环境变量等描述性文本场景。
<var></var> 标签只干一件事：语义化标记「变量名本身」，不是声明变量、不存值、不参与 JS 运行，也不影响高亮器识别代码。
什么时候必须用 <var></var> 标签
只在描述性文本中，需要向人类或辅助技术明确指出“这个词代表一个可变的符号”时才用：
- 数学公式说明里强调符号含义，比如“三角形面积 = ½ ×
<var>b</var>×<var>h</var>”，b和h是名字，不是数值 - API 文档中标出路径占位符，如
GET /api/posts/<var>id</var>，id是需替换的参数名 - 函数调用描述中指代形参，如“传入
fetch(<var>url</var>)”，url是参数名，不是字符串字面量 - 配置说明中突出环境变量标识，如“将
<var>DATABASE_URL</var>写入 .env 文件”
为什么不能把 <var></var> 塞进 <code> 里
嵌套会破坏语义和工具链：
-
<code>const <var>count</var> = 42;—— 高亮器（Prism / highlight.js）看到的是普通文本count，不会加.token.variable类，也无法触发变量样式规则 - 屏幕阅读器可能收到冲突信号：外层
<code>表示“这是可执行代码”，内层<var></var>又说“这只是个名字”，逻辑矛盾 - 正确写法是让高亮器自己分析语法结构，你只需保证
<code>块内容完整、合法，例如<code>const count = 42;
常见误用与报错现象
这些写法看似合理，实则违背语义，还可能引发可访问性或维护问题：
-
<var id="user_id">x</var>后试图用 JS 读取：document.getElementById('user_id').textContent返回字符串"x"，不是变量x的值 -
<input name="<var>user_id</var>">——<var></var>不参与属性解析，name属性值就是字面量"<var>user_id</var>"，不是user_id -
<var>let x = 42</var>—— 这不是变量名，是完整语句，该用<code>或<pre class="brush:php;toolbar:false;"></pre> - 把
<var></var>当 CSS 自定义属性函数用，比如color: var(--primary);和<var></var>标签完全无关，纯属命名巧合
怎么配合 <code> 和其他短语标签
关键看你想表达的对象性质：
-
<var></var>：仅变量名/占位符本身，如<var>timeout</var>（参数名） <code>：可引用的完整代码片段，如<code>fetch(url)、<code>--primary-
<kbd></kbd>：用户要按的键，如<kbd>Ctrl</kbd>+<kbd>C</kbd> -
<samp></samp>：程序输出样本，如<samp>Error: ENOENT</samp>
组合示例：<p>调用 <code>fetchUser(id)，其中 id 必须为字符串类型
<code> 包裹调用结构，<var></var> 单独标出参数名，语义清晰且无障碍友好。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
