dom节点的style属性设置问题

Question

我今天做了个实验

node.style['margin-left'] = '100px'

这段代码设置css属性成功了

但我在控制台中输出node.style并没发现 margin-left这一属性 我只看见

和marginLeft 已经发生改变

再次访问node.style['margin-left'] 得到的也是100px

问题：

• 为什么 对象及对象及其原型中没有 margin-left 属性 但我只设置style.marginLeft ，访问margin-left仍然有值 并且改变其中一方另一方一会跟着变

Answer 1

css的属性，在js的style对象里是可以通过camelCase来访问的，这样做的好处是可以用.marginLeft，也可以用["marginLeft"]，其实通过短号的形式也可以访问，但就不能用.margin-left了(js语法不允许),但是可以用["margin-left"]来访问。dom对象里两种访问是等价的，所以两个属性也是同步修改的。