如何使用JavaScript在HTML标签内部添加disabled属性？

针对你需要为原生HTML标签添加非class/id类的标准属性（比如示例中的disabled）的场景，不需要修改标签包裹的文本内容，直接通过DOM操作即可实现目标效果。

对应示例场景的可运行代码 #

首先定位目标按钮元素：示例中的按钮带有id="reset"标识，可直接通过原生方法获取：
const resetBtn = document.getElementById('reset')
之后可选择以下任意一种正确写法实现需求，二选一即可：

• 方式1：直接操作元素内置DOM属性（最简洁，推荐）

  // 赋值为true后，浏览器会自动在标签上渲染出disabled属性标记
  resetBtn.disabled = true;
  

• 方式2：通过原生属性操作API添加

  注：这种用法不属于你提到的被排除场景——你排除的是通过classList、setAttribute修改class、id类属性的操作，为其他标准HTML属性使用对应API是常规合规写法

  resetBtn.setAttribute('disabled', '');
  

效果验证 #

执行上述任意一段代码后，初始HTML结构：
<button class="button is-danger" id="reset">Reset</button>
会自动渲染为目标结构：
<button class="button is-danger" id="reset" disabled>Reset</button>

常见避坑提示 #

• 不要把disabled当成标签内部的显示文本写入，比如执行resetBtn.innerText = 'disabled'，这类操作只会修改按钮的展示文字，既不会让按钮进入禁用状态，也不会在标签上生成对应的属性标记
• 针对disabled、checked、readonly这类原生布尔属性，直接操作DOM同名属性的效率高于手动拼接属性字符串，且全浏览器兼容无差异

内容的提问来源于stack exchange，提问作者Soyoon Moon