博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
对于DOM的attribute和property的一些思考
阅读量:5981 次
发布时间:2019-06-20

本文共 1099 字,大约阅读时间需要 3 分钟。

hot3.png

前段时间,观看了WTP的一篇文章“DOM的attribute和property”,觉得写的很好,感谢WTP的作者---玉伯.

然后,我又在网上查询了些资料(国内外人写的心得),觉得有篇写的很好,推荐下

里面解释到了关于attribute与property的区别,写的很好,我就不再深入了。

首先我们先看WTP给的一个小例子;

html代码

我们先看看取值;

然后我将输入框里面的值修改下;

再看看取值:

很奇怪!为什么他们两个值是不同的呢??????(tell me why!!!)

其实就是attribute和property在搞鬼。。。

再看看这篇文章,

对于attribute和property的解释都很好。

尤其是最后的总结,我很赞成。

我们再来看看玉伯对于两个的解释

attribute

input节点有很多属性(attribute):‘type’,'id','value','class'以及自定义属性,在DOM中有setAttribute()和getAttribute()读写DOM树节点的属性(attribute)

PS:在这里的getAttribute方法有一个潜规则,部分属性(input的value和checked)通过getAttribut取到的是初始值,这个就很好的解释了之前的n1为1。

Property

javascript获取到的DOM节点对象,比如a 你可以将他看作为一个基本的js对象,这个对象包括很多属性(property),比如“value”,“className”以及一些方法,setAttribute,getAttribute,onclick等,值得注意的是对象的value的属性(property)取值是跟着输入框内的当前值一起更新的,这解释了之前的n2为什么为1000了。

所有在日常的工作中,推荐是使用 property,这样事情处理起来比较简单一些,attribute永远是字符串。。

PS:关于自定义属性,对于浏览器的兼容性问题,大家自己去研究研究,小弟还没有研究会,就不作小结了。。。(有的注解不管你大小写,有的却分的很清楚)。。。

貌似chrome就不管你大小写。。。

接着我们来看看我们对于使用attribute和property自定义属性的时候的一些区别

可以看出,自定义的属性对于attribute和property是互不干扰的

但是对于DOM自带的属性就共享了。。。

大家有什么好的建议或者想法:大胆的提出来吧!大家交流交流心得。。。

转载于:https://my.oschina.net/bosscheng/blog/125833

你可能感兴趣的文章
安全应急响应的一些经验总结
查看>>
MIT TR 35 Anca Dragan:为了人类与机器人和谐地工作、生活而奋斗
查看>>
AlwaysON同步的原理及可用模式
查看>>
Disconf入门指南(1)
查看>>
物联网支付技术架构和发展趋势
查看>>
中建信息(834082)与亚信安全达成战略合作 双重安全为您保驾护航
查看>>
英特尔7.4亿美金投资Cloudera持股达18%
查看>>
为厂商赋能 阿里智能云加速互联网+实践
查看>>
零售互联网化“革命”从改造收银台开始
查看>>
程序员编程面试取胜的8个技巧
查看>>
浅谈保险业的信息安全
查看>>
网络安全的四层智能化革命
查看>>
盘点全球最热十家大数据公司中国占三席
查看>>
PostgreSQL GUC 参数级别介绍
查看>>
从大数据谎言中区分实际需求
查看>>
中国加强云计算话语权:明确重点标准研制方向
查看>>
Windows 10磁盘修复工具Chkdsk新增的命令有哪些?赶快收藏
查看>>
如何备份一个磁盘分区
查看>>
什么?容器安全实践迎头赶上还需十年?
查看>>
运营商如何从NaaS中获益
查看>>