我觉得这里有点不详细，这两种形式都是修改了节点的
我个人的结论是
property和attribute形式都可以修改节点的属性，但是对于新增或删除的自定义属性，能在html的dom树结构上体现出来的，就必须要用到attribute形式了。
更具体的如下：

// attribute
p1.setAttribute('data-name', 'imooc')
// p1.data-name="imooc"; // 这是错误的，不能和操作property形式替换使用
console.log( p1.getAttribute('data-name') )
// p1.removeAttribute('mytest') // 必须attribute形式删除

// property
p1.removeAttribute('font-size') // property和attribute形式删除都可以，这里删除后getAttribute为null，没有font-size属性了
// p1.style.fontSize="";  // 和上面一句效果一样
// p1.style.fontSize="50px"; // 这是正确的，可以和操作property形式替换使用，新增font-size并设置50px
// p1.setAttribute('style', 'font-size: 50px;')
console.log( p1.getAttribute('style') )

这么说也许会好一点