最近在读《Vue.js设计与实现》。在第8章“挂载与更新”中，作者花费了一些篇幅去讲HTML Attributes 和DOM Properties。浏览器在解析普通的HTML 文件时，会自动分析HTML Attributes 并设置合适的DOM Properties，但是Vue.js 中的template 不会被浏览器解析，所以原本需要由浏览器完成的工作，就需要由框架来完成。
紧接着举了很多案例来说明，不同的情况下应该如何将Attributes 合理地转换为Properties。比如说，在disabled 属性为false 时或仅添加属性不设值的时候如何进行正确地转换；比如说对于只读的form 属性只能通过setAttribute 去设置；比如说如何将对象、数组等动态转换为class，以及在设置class 属性时应该选择setAttribute、el.className 和el.classList 中的哪一种方法。
在讨论这些案例的过程中，作者写了下述一段话：我们不会列举所有情况，并一一讲解。因为掌握处理问题的思路更重要，另外我们也不可能把所有需要特殊处理的地方都记住，更何况有时我们根本不知道在什么情况下才需要特殊处理。所以上述解决方案本质上是经验之谈，不要惧怕写不出完美的代码，只要在后续迭代过程中见招拆招，代码就会变得越来越完善，框架也会变得越来越健壮。
紧接着举了很多案例来说明，不同的情况下应该如何将Attributes 合理地转换为Properties。比如说，在disabled 属性为false 时或仅添加属性不设值的时候如何进行正确地转换；比如说对于只读的form 属性只能通过setAttribute 去设置；比如说如何将对象、数组等动态转换为class，以及在设置class 属性时应该选择setAttribute、el.className 和el.classList 中的哪一种方法。
在讨论这些案例的过程中，作者写了下述一段话：我们不会列举所有情况，并一一讲解。因为掌握处理问题的思路更重要，另外我们也不可能把所有需要特殊处理的地方都记住，更何况有时我们根本不知道在什么情况下才需要特殊处理。所以上述解决方案本质上是经验之谈，不要惧怕写不出完美的代码，只要在后续迭代过程中见招拆招，代码就会变得越来越完善，框架也会变得越来越健壮。
展开
5
13
![[看]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_97.39cdc9f.png)