例如网页上有一个个人信息展示区域，此区域中展示用户名和积分，现在我将这个模块封装为一个对象，针对用户积分部分在实现过程中我想到两种写法。一是，将存放积分的Dom节点作为对象的属性，每次操作时通过innerText读取或修改积分。二是设置一个存放积分数值的属性，再编写get和set方法每次操作去调用get和set方法修改属性和Dom节点。个人总结，第一种方法优势是处每次修改积分只需要维护一个属性值。缺点是，每次都要调用innerText读取和修改，读取时还要进行类型转换并且一旦Dom结构发生改变(例如不再界面上展示积分，但程序仍然需要积分数值)JS代码就需要修改。第二种方法需要增加额外两个方法，并且容易出现属性值和Dom节点上的值不一致的情况。不知道上面两种实现思路哪种更好，或是有其他更好的方法(对积分修改的频率不同是否影响方案的选择)。
衍生问题：一个Dom节点有两种状态，状态a时有类名a，状态b时没有类名a。抽象时应将此节点对象作为属性值，每次操作时通过是否包含类名a来读取状态，还是应该将状态值作为一个属性，再设置相应的set方法
直接读取dom节点的属性值更好一些，因为初始化加载页面的时候这个值应该就通过后台模板赋值到dom节点上去了，所以说直接读取dom节点更通用些。这个属性值没有必要非要通过innerText来获取，可以通过getAttribute来获取，也就是说做成一个自定义属性。
我之前也有考虑过和你一样的事情，但是后来我发现，这种情况下，用一个MV*框架更舒坦。我正在使用Vue.js，有兴趣可以搜索一下。