为什么某些技术上可序列化的输入属性不能序列化? [英] Why aren't some technically serializable input properties serializable?

问题描述

Serializable 属性定义为:

• 当你设置元素的一个属性时，它会在getAttribute等序列化查询中体现出来，你可以在DOM Inspector中看到变化
• 当您获得元素父节点的 .innerHTML 时，返回的 html 字符串将包含所有可序列化的属性作为它们的属性对应物

我制作了一个页面，看起来它可靠地打印了 Chrome 和 Firefox 中 input 元素的所有可序列化属性的表格:http://jsfiddle.net/tEVLp/16/.自定义属性永远无法序列化，因此在 firefox webkitSpeech 等中是不可序列化的.在 chrome 中测试以获得最佳结果.

所有布尔值都是 true，因为 false 属性的序列化将导致缺少在测试中为假阴性的属性.

所以我的问题是，为什么诸如 .value 和 .checked 之类的属性不能序列化?

从技术上讲，两者都是可序列化的..value 只是一个字符串，浏览器在序列化其他布尔属性时没有问题，例如 .readOnly 和 .disabled.

我最好的猜测是，因为 .defaultValue 序列化为 "value"-attribute 并且 .defaultChecked 序列化为 "checked"-attribute，会发生冲突，因此.value 和 .checked 不能被序列化.在那种情况下，为什么为这些选择了 defaultX 而不是反映更有用的当前 .value 和 .checked 状态的那些?

解决方案

输入元素的规范 定义了确切的行为.从这里开始阅读(之前即，定义了 DOM 接口、属性和类型).

简明摘要(value的定义与checked类似，所以为了简洁起见，我将只解释value).>

属性"value 反映了value ^def,
属性"value 反映了 值内容属性 ^def.

• 属性定义了默认值属性 ^(ref).该值也是反射 ^def 通过 defaultValue 属性 (ref).
• 设置 value 属性后，value 属性会发生变化 (ref) *.

措辞非常简洁.我跳过了一个重要的细节.规范在这一点上非常明确，所以我只引用 脏值标志部分:

<块引用>

每个输入元素都有一个布尔值脏值标志.肮脏的价值创建元素时，标志必须最初设置为 false，并且每当用户与控件交互时都必须设置为 true改变价值的方式.

value content 属性给出输入的默认值元素.添加、设置或删除 value 内容属性时，如果控件的脏值标志为 false，则用户代理必须设置元素的值到 value 内容属性的值，如果有，否则为空字符串，然后运行当前值清理算法，如果定义了一个.

Serializable property is defined as:

• When you set a property of the element, it will be reflected in serialization queries such as getAttribute and you can see the changes in DOM Inspector
• When you get the .innerHTML of the element's parentnode, the returned html string will contain all the serializable properties as their attribute counterparts

I have made a page that looks like it's reliably printing a table of all serializable properties of the input element in Chrome and Firefox: http://jsfiddle.net/tEVLp/16/. Custom properties are never serializable, so in firefox webkitSpeech etc are not serializable. Test in chrome for best results.

All booleans are true because serialization of a false property would be the absence of the attribute which is a false negative in the test.

So my question is, why are not properties such as .value and .checked serializable?

Technically, both are serializable. .value is just a string and the browser has no problems with serializing other boolean properties, such as .readOnly and .disabled.

My best guess is that since .defaultValue serializes to "value"-attribute and .defaultChecked serializes to "checked"-attribute, there would be a conflict and thus the .value and .checked cannot be serialized. In that case, why are the defaultX ones chosen for these and not the ones that reflect the more useful current .value and .checked states?

解决方案

The Specification for input elements defines the exact behaviour. Start reading from here (before that, the DOM interface, attributes and types are defined).

Concise summary (value is defined similarly to checked, so for brevity, I'm going to explain value only).

The "property" value reflects value ^def,
the "attribute" value reflects the value content attribute ^def.

• The attribute defines the default value property ^(ref). This value is also reflected ^def by the defaultValue property (ref).
• When the value attribute is set, then the value property changes (ref) *.

That was worded very concisely. I've skipped an important detail. The specification is very clear at this point, so I'll just quote the dirty value flag section:

Each input element has a boolean dirty value flag. The dirty value flag must be initially set to false when the element is created, and must be set to true whenever the user interacts with the control in a way that changes the value.

The value content attribute gives the default value of the input element. When the value content attribute is added, set, or removed, if the control's dirty value flag is false, the user agent must set the value of the element to the value of the value content attribute, if there is one, or the empty string otherwise, and then run the current value sanitization algorithm, if one is defined.

这篇关于为什么某些技术上可序列化的输入属性不能序列化?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！