getAttribute只能读取HTML中真实存在的属性，如data-config；需先在标签中声明，再用getAttribute获取字符串，最后JSON.parse转对象，注意避免JSX语法和property混淆。
getAttribute 不能直接获取“内联配置参数”这种自定义概念，它只能读取 HTML 元素上真实存在的属性（attribute），比如 id、class、data-* 或自定义的内联属性（如 config='{"theme":"dark"}'）。关键在于：你得先在 HTML 中把配置作为属性写进去，然后用 getAttribute 读出来。
确保配置以合法 HTML 属性形式存在
浏览器只认写在标签里的属性。例如：
<div id="chart" data-config='{"width":600,"height":400}'></div>
这里用了标准的 data- 前缀，语义清晰且不会和原生属性冲突。也可以用非标准名（如 config），但不推荐——可能被忽略或引发校验警告。
立即学习“Java免费学习笔记（深入）”；
用 getAttribute 读取字符串，再解析（如需对象）
getAttribute 返回的是字符串，即使你写了 JSON，它也不会自动转成对象：
const el = document.getElementById('chart');const configStr = el.getAttribute('data-config'); // '{"width":600,"height":400}'const config = JSON.parse(configStr); // { width: 600, height: 400 }
注意：如果字符串格式非法（比如单引号、未转义、含注释），JSON.parse 会报错。建议后端或构建时保证输出合法 JSON，前端加 try-catch 更稳妥。
避免常见误区
- 不要写
<div config={{"theme":"dark"}}>—— 这是 JSX 语法，不是 HTML，浏览器根本不会把它当属性存下来。 - 不要混淆
getAttribute和dataset：后者专为data-*设计，自动小驼峰转换（data-user-id→el.dataset.userId），但返回仍是字符串，JSON 还得自己 parse。 - 不要用
getAttribute读取style、value这类反映当前状态的属性——它们属于 property，应优先用el.style或el.value。
