可通过JavaScript动态修改HTML元素属性：一、setAttribute设置任意属性；二、直接赋值标准属性字段；三、dataset操作data-自定义属性；四、className/classList管理class；五、style修改内联样式。
如果您需要在网页运行过程中改变HTML元素的属性值，例如修改图片的src、按钮的disabled状态或链接的href，则可以通过JavaScript直接操作DOM节点的属性。以下是实现属性动态调整的具体方法：
一、使用setAttribute方法
该方法适用于为任意HTML元素设置任意属性，包括标准属性和自定义data属性，且能确保属性名与值严格按字符串形式写入。
1、获取目标元素，例如通过document.getElementById("myBtn")获取ID为myBtn的按钮。
2、调用元素的setAttribute()方法，传入属性名和属性值两个参数，如element.setAttribute("disabled", "true")。
立即学习“前端免费学习笔记（深入）”；
3、若需设置自定义属性，可使用data-*前缀，例如element.setAttribute("data-status", "processed")。
二、直接赋值属性字段
对于部分内置HTML属性，DOM元素对象提供了对应的JS属性字段，直接赋值更简洁高效，且自动同步到渲染层。
1、获取目标元素，例如const img = document.querySelector("img")。
2、对标准属性字段直接赋值，如img.src = "https://example.com/new.jpg"。
3、布尔属性（如disabled、checked）可通过赋值true或false控制，如button.disabled = true。
三、使用dataset API操作data属性
当需批量读写以data-开头的自定义属性时，dataset提供命名规范化支持，自动将kebab-case转为camelCase键名。
1、获取目标元素，例如const div = document.getElementById("container")。
2、通过div.dataset.xxx访问或设置对应data-xxx属性，如div.dataset.userId = "789"会生成data-user-id="789"。
3、删除自定义属性使用delete div.dataset.xxx，例如delete div.dataset.theme。
四、使用className和classList管理class属性
class属性具有特殊性，直接赋值className会覆盖全部类名；而classList提供原子化增删切换单个类名的能力，避免误操作。
1、获取目标元素，例如const header = document.querySelector("header")。
2、添加类名使用header.classList.add("highlighted")。
3、移除类名使用header.classList.remove("hidden")。
4、切换类名使用header.classList.toggle("active")，存在则删、不存在则加。
五、通过style属性修改内联样式
直接修改元素的style属性可动态控制CSS内联样式，适用于临时样式变更，不影响外部样式表规则。
1、获取目标元素，例如const paragraph = document.getElementById("intro")。
2、设置单个样式属性，如paragraph.style.color = "#ff6b35"。
3、设置带单位的数值属性，如paragraph.style.fontSize = "18px"。
4、启用/禁用某条样式可赋值空字符串，如paragraph.style.display = ""（恢复默认显示）。
