HTML中属性和属性有什么区别?
在jQuery 1.6.1所做的更改之后,我一直试图在HTML中定义属性和属性之间的区别。
查看jQuery 1.6.1发行说明(接近底部)的列表,似乎可以按如下方式对HTML属性和属性进行分类:
属性:所有具有布尔值或UA计算的值,例如selectedIndex。
属性:可以添加到既不是布尔值也不包含UA生成值的HTML元素的'属性'。
思考?
在编写HTML源代码时,您可以在HTML元素上定义属性。 然后,一旦浏览器解析你的代码,就会创建一个相应的DOM节点。 该节点是一个对象,因此它具有属性。
例如,这个HTML元素:
<input type="text" value="Name:">
有2个属性( type
和value
)。
一旦浏览器解析了这段代码,就会创建一个HTMLInputElement对象,这个对象将包含许多属性,如:accept,accessKey,align,alt,attributes,autofocus,baseURI,checked,childElementCount,childNodes,children,classList,className, clientHeight等
对于给定的DOM节点对象,属性是对象的属性,以及属性是的元素attributes
该对象的属性。
当为给定的HTML元素创建DOM节点时,其许多属性与具有相同或相似名称的属性相关,但它不是一对一的关系。 例如,对于这个HTML元素:
<input id="the-input" type="text" value="Name:">
相应的DOM节点将具有id
, type
和value
属性(等等):
该id
属性是反射属性id
属性:获取属性读取属性值,并设置属性写入属性值。 id
是一个纯粹的反射属性,它不会修改或限制该值。
该type
属性是一个反射的属性type
的属性:获取属性读取的属性值,并且设置属性写入的属性值。 type
不是纯粹的反射属性,因为它仅限于已知值(例如输入的有效类型)。 如果你有<input type="foo">
,那么theInput.getAttribute("type")
会给你"foo"
但是theInput.type
会给你"text"
。
相反, value
属性不反映value
属性。 相反,它是输入的当前值。 当用户手动更改输入框的value
, value
属性将反映此更改。 所以如果用户在输入框中输入"John"
,那么:
theInput.value // returns "John"
然而:
theInput.getAttribute('value') // returns "Name:"
所述value
属性反映输入盒内的当前文本的内容,而value
属性包含的初始文本的内容value
从HTML源代码属性。
所以如果你想知道文本框内的内容,请阅读属性。 但是,如果您想知道文本框的初始值是什么,请阅读该属性。 或者你可以使用defaultValue
属性,它是value
属性的纯粹反映:
theInput.value // returns "John"
theInput.getAttribute('value') // returns "Name:"
theInput.defaultValue // returns "Name:"
有几个属性直接反映它们的属性( rel
, id
),一些是直接反射,名称略有不同( htmlFor
反映for
属性, className
反映class
属性),许多反映它们的属性但有限制/修改( src
, href
, disabled
, multiple
)等等。 规范涵盖了各种反思。
答案已经解释了如何处理属性和属性的不同,但我真的想指出这是多么疯狂 。 即使这在某种程度上是规范。
让一些属性(例如id,class,foo,bar)在DOM中只保留一种值,而某些属性(例如checked,selected)保留两个值是很疯狂的; 即“装入时”的值和“动态状态”的值。 (DOM是不是应该完全代表文档的状态?)
绝对必要的是, 两个输入字段 (例如文本和复选框)的行为方式完全相同 。 如果文本输入字段没有保留单独的“何时加载”值和“当前动态”值,为什么复选框? 如果复选框的checked属性有两个值,为什么它的类和id属性没有两个值? 如果您希望更改文本*输入*字段的值,并且您希望DOM(即“序列化表示形式”)发生更改并反映此更改,那么您为什么不希望从输入字段在checked属性上键入复选框?
“它是一个布尔属性”的区分对我来说没有任何意义,或者至少不是充分的理由。
以及这些由w3c指定什么是属性和什么是属性http://www.w3.org/TR/SVGTiny12/attributeTable.html
但目前attr和道具没有那么不同,而且几乎相同
但他们更喜欢支撑某些东西
首选用法总结
.prop()方法应该用于布尔属性/属性和html中不存在的属性(如window.location)。 所有其他属性(您可以在html中看到的)可以并应该继续使用.attr()方法进行操作。
实际上,如果你使用attr或prop或者两者兼而有之,实际上你不需要改变某些东西,但是我在我自己的应用程序中看到prop支持atrr没有使用的地方,所以我接受了我的1.6 app prop =)
链接地址: http://www.djcxy.com/p/87985.html上一篇: What is the difference between properties and attributes in HTML?