前端开发：是否建议在div的id属性中临时存储字符串？

为啥不推荐这么做： #

• id属性有它的本职用途：它的核心作用是唯一标识DOM元素，比如页面锚点跳转、表单标签关联、屏幕阅读器识别这些场景都会依赖它。把它当成临时存值的容器，完全不符合HTML的设计规范。
• 容易埋下隐患：哪怕你现在不用它做元素选择或样式设置，后续自己写代码或者引入第三方脚本时，很可能不小心用到这个id；甚至浏览器的锚点功能会自动识别id值，引发意外问题。而且HTML要求整个页面内id必须唯一，要是你存的临时值重复了，直接违反规则。

推荐的替代方法 #

1. 使用data-*自定义属性 #

这是HTML标准专门为存储元素关联的自定义数据设计的属性，规范又安全：

<div data-temp-value="你要存的临时值"></div>

在JavaScript中读写也很便捷：

const targetDiv = document.querySelector('div');
// 获取临时值
const tempVal = targetDiv.dataset.tempValue;
// 修改临时值
targetDiv.dataset.tempValue = '更新后的临时值';

2. 直接存在JavaScript变量中 #

如果这个临时值不需要和DOM元素绑定，直接用JS变量存储更高效，没必要折腾DOM：

let tempValue = '你的临时值';
// 后续直接使用这个变量即可

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