每个 HTML 属性都会对应相应的 DOM 对象属性。

    2. input.type;      // 'text'
    3. input.className; // 'text'
    5. label.htmlFor;   // 'username'

    属性操作方式

    Property Accessor

    通过属性方法符得到的属性为转换过的实例对象（并非全字符串）。

    特点

    • X 通用行差（命名异常，使用不同的命名方式进行访问）
    • X 扩展性差
    • √ 实用对象（取出后可直接使用）
    1. <div>
    2.   <label for="username">User Name: </label>
    3. </div>

    写入属性

    可增加新的属性或改写已有属性。

    1. input.value = 'new value';
    2. input[id] = 'new-id';

    getAttribute / setAttribute

    特点

    • X 仅可获取字符串（使用时需转换）
    • √ 通用性强

    获取到的均为属性的字符串。

    1. var attribtue = element.getAttribute('attributeName');

    写入属性

    可增加新的属性或改写已有属性。

    dataset

    1. div.dataset.id;         // '1234'
    2. div.dataset.username;   // 'x'
    3. div.dataset.email;      // 'mail@gmail.com'

    NOTE：dataset 在低版本 IE 不可使用，但可通过 getAttribute 与 setAttribute 来做兼容。