原文链接:https://blog.csdn.net/zhy13087344578/article/details/79036967
一、研究两者之间关系的出发点(功能需求)
研究attribute与property区别,目的是想在修改标签样式的时候能够实现想要的效果,例如使用attribute可新增标签的特性setAttribute('style','background:red;')。
二、修改attibute、property值的方法(针对标签中已存在的属性)
使用'标签名称.setAttribute(属性名称,修改的属性值)'时,相应的property的值也会改变(使用标签名称.属性名称获取property的值);
使用'标签名称.属性名称=修改的属性值'时,相应的attribute的值也会改变(使用标签名称.getAttribute('属性名称')获取attribute的值)
对于class、id、name等属性(一般属性),无论是attribute还是property中的哪一方面发生改变,都会互相影响。
需要注意:对于已有的class、id、name等属性,无论是attribute还是property中的哪一方面发生改变,都会互相影响;而对于新增的属性,无论是attribute还是property中的哪一方面新增,都不会影响到另一方。
三、hidden属性(特殊属性)
1、当标签中有hidden=xxx时且不为null,则property中的hidden=true,元素能够隐藏。
2、当attribute中移除hidden,attribute中的hidden值变为null,即removeAttribute('hidden')时property中的hidden=false,元素会显示;当property中的hidden=false时,attribute中的hidden值变为null,元素会显示。
总结来说,property中的hidden=true,元素就隐藏,property中的hidden=false,元素就显示;attribute中的hidden不为null,元素就隐藏,attribute中的hidden为null,元素就显示。
四、知识点
1、properties下包含'property'和'attributies',attributies下包含attribute。
2、attribute是标签特性,可以自定义,方法有两种:①直接在标签上添加;②使用setAttribute添加,这两种情况下添加的都是attribute。
3、property的修改是使用xx.属性名称进行的。
4、某个已存在的属性(既有attribute又有property)在attribute或property中的任一方修改时,都会影响到另一方(互相影响);而非默认后添加的属性修改时,不会影响到另一方(互相无影响)
5、一些特殊属性,需要特殊对待,也就是说有与上面规则不同的情况存在。