码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript の 内容属性(HTML属性attribute)和 DOM 属性(property)

时间:2020-05-12 23:13:38      阅读:124      评论:0      收藏:0      [点我收藏+]

标签:对象模型   not   其他   获得   license   ice   windows   操作   ==   

[博文]内容属性(HTML属性)和 DOM 属性

标签: 博文 JavaScript



粗略解读(与jQuery做对比)

  • 内容属性(HTML属性) : attribute

  • DOM 属性(Element属性) : property

  • jQuery 中的:attr() 对应原生JS中的 setAttribute() / getAttribute;

  • jQuery 中的:prop() 对应原生JS中 DOM对象.property;


在IE中

  • 在更早版本的 Windows Internet Explorer 中,内容属性在 JavaScript 对象上表示为文档对象模型 (DOM) expando。

    即: HTML属性attr === DOM属性prop
  • 从 Windows Internet Explorer 91 开始,内容属性不再连接到 DOM expando,这提高了 Internet Explorer 和其他浏览器之间的可互操作性。

    即IE10+中: HTML属性attr !== DOM属性prop

解读

  • “内容属性-attr”在是 HTML 源中指定的属性,例如,<element attribute1="value" attribute2="value">。许多内容属性都作为 HTML 的一部分进行预定义;HTML 还支持其他用户定义的内容属性。

  • “dom属性-prop”是从 JavaScript 中的对象检索的值,可通过 . 运算符获得值, 例如 document.all["myelement"].domExpando。JavaScript 还支持其他用户定义的属性。


约定

因为IE9+ 通过 var divExpando = div.myAttr; 的方法获得 内容属性(HTML属性)会导致 得到一个未定义的值,所以我们约定使用代码:

    var divExpando = div.getAttribute("myAttr"); // 得到有价值的HTML属性


  1. 在 IE8 和以前版本中(包括 IE8 标准模式和 IE9 中的以前模式),仍然存在 myAttr 内容属性 表示存在 myAttr DOM expandovar divExpando = div.myAttr; // divExpando 任然会得到有价值的定义 ?

JavaScript の 内容属性(HTML属性attribute)和 DOM 属性(property)

标签:对象模型   not   其他   获得   license   ice   windows   操作   ==   

原文地址:https://www.cnblogs.com/10manongit/p/12879495.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!