attribute 强制行为 — 非兼容
最后更新于：2022-04-02 08:13:46
>[success] # attribute 强制行为
~~~
1.删除枚举 attribute 的内部概念，并将这些 attribute 视为普通的非布尔 attribute
2.重大改变：如果值为布尔值，则不再删除 attribute false。相反，它被设置为 attr='false'。
移除 attribute，使用 null 或者 undefined
注意下面关于属性是通过 'v-bind' 绑定
~~~
>[info] ## 理解 IDL 属性与内容属性、布尔值属性与枚举属性
~~~
1.看过上面官方解析比较晕原因是没有分清楚'IDL 属性与内容属性、布尔值属性与枚举属性'
~~~
>[danger] ##### 布尔值属性
~~~
1.常见的布尔属性'required, readonly, disabled，checked',它们的特点：
1.1.在于是否声明该属性，声明为true 未声明为false
1.2.声明的格式，其值必须是一个空字符串（即该属性的值未分配），或者是一个大小写无关的 ASCII
字符串，该字符串与属性名严格相同，前后都没有空格
2.通过下面例子可以知道布尔类型属性是否生效不在于你后面赋值而是在于你是否声明
~~~
* 举个例子:
~~~html
~~~
>[danger] ##### 枚举类型
~~~
1.可以理解成匹配的元素是是一个系列的例如'autocomplete' 它可以对应的值' username、email、country、tel、url '
容易和枚举搞混的'contenteditable ' 他的枚举可以true 或者 false
2.下面代码以'contenteditable ' 为例当空字符串也代表 'true'，而不分配值时，也与空字符串等价都是他枚举
提供的true等同，但是当声明的枚举例如下面'abcdefg' 不存在或者该属性没定义都等同枚举提供的false属性效果
~~~
~~~html
An editable item
An editable item
An editable item
An editable item
An editable item
An editable item
An editable item
~~~
>[danger] ##### 内容属性IDL属性
~~~
1.HTML 中，属性还有 内容属性 和 IDL属性 说法。注意，这两种属性，并不是对标签属性的划分。
他们只是属性不同地方的不同描述和写法而已。
2.内容属性 接收的值都是字符串。编写 HTML 时，直接写在标签中的就是内容属性。此外，内容属性还可以
通过 JS 的 setAttribute() 来设置。
An editable item
input.setAttribute('type', 'text');
input.getAttribute('type')
3.IDL属性 是一个 JavaScript 属性（property），是 DOM 提供给 JS 的真正属性。通过 . 运算符来
设置，且只接收正确类型的值。如果接收值的类型不正确，会自动转化成正确的类型。
input.type = 'password';
~~~
>[danger] ##### 参考文章
[IDL 属性与内容属性、布尔值属性与枚举属性傻傻分不清楚？](https://zhuanlan.zhihu.com/p/144954383)
>[info] ## Vue2.x 对这三种属性转换
~~~
1.对于某些属性/元素对，Vue 采用 IDL 属性 形式处理：如 value of
,