Javascript 自定义元素上的属性/属性名称

我是为大客户开发定制元素库的团队的一员（根据定制元素规范v1）。到目前为止，我们已经开发了大约30个组件，其中一半是自主定制元素，另一半是定制内置组件

我们目前正处于重构和统一这些组件的API的阶段。几乎所有这些组件都具有自定义属性/属性

对于标准HTML元素，惯例是使用

数据-

属性，这些属性反映到元素的

数据集

我知道，自治自定义元素允许自由属性/属性命名，只要名称与

HTMLElement

已有的名称不冲突

据我所知，

data-

属性背后的想法是确保没有库开始实现可能与HTML标准的未来版本冲突的自定义属性

但是，这同样适用于属性名称。假设HTML标准将获得一个新的通用属性，让我们抽象地称之为attr。当然，这也会反映到HtmleElement原型上的同名属性

我的问题是：

建议采取什么办法来避免今后的冲突？对于自定义属性实现，是否始终只使用

数据-

-属性，从而通过使用

数据集而不是直接附加到元素的属性来避免冲突

如果是这样，那么您将如何实现“布尔”数据属性（如果属性值无关紧要，则状态是通过该属性的不存在实现的）

是否可以为元素的

数据集中的属性定义自己的getter和setter

---

如果有任何不清楚的地方，请要求澄清。我试图使问题尽可能简洁。

我不担心我的自定义元素属性或属性将来会成为

HTMLElement的预定义属性或属性。如果规格改变了，我会处理的。但是，试图猜测未来可能使用的所有东西是不可能的，也不值得我花时间

我避免对自定义元素使用
数据-
属性。
dataset
值只是字符串，不能很好地转换。例如，如果我这样做：

el.dataset.dog={woof:10}

然后，我的标记get是这样一个属性：
datadog=“[object object]”
，这个
console.log（el.dataset.dog）
显示
“[object object]”
。这违背了许多可能需要处理对象的属性的用途

我只为必须是属性的事物创建属性。如果我必须允许HTML定义默认值，或者如果我需要创建CSS属性选择器，那么我将创建一个属性。但只有在这两种情况下

我为我需要的一切创建属性（getter/setter）或函数。将任何格式的数据传入属性或函数比将其转换为字符串以通过属性传入更容易

我甚至接管了一个或多个现有的HtmleElement属性和属性。这种情况很少见，但有时我需要对该值执行一些操作，或者我只是不希望发生默认操作同样，这种情况也很少见。
我不担心我的自定义元素属性或属性将来会成为
HTMLElement
的预定义属性或属性。如果规格改变了，我会处理的。但是，试图猜测未来可能使用的所有东西是不可能的，也不值得我花时间

我避免对自定义元素使用
数据-
属性。
dataset
值只是字符串，不能很好地转换。例如，如果我这样做：

el.dataset.dog={woof:10}

然后，我的标记get是这样一个属性：
datadog=“[object object]”
，这个
console.log（el.dataset.dog）
显示
“[object object]”
。这违背了许多可能需要处理对象的属性的用途

我只为必须是属性的事物创建属性。如果我必须允许HTML定义默认值，或者如果我需要创建CSS属性选择器，那么我将创建一个属性。但只有在这两种情况下

我为我需要的一切创建属性（getter/setter）或函数。将任何格式的数据传入属性或函数比将其转换为字符串以通过属性传入更容易

我甚至接管了一个或多个现有的HtmleElement属性和属性。这种情况很少见，但有时我需要对该值执行一些操作，或者我只是不希望发生默认操作同样，这是罕见的。