JQuery 返回具有空属性选择器的非空输入

Question

在使用 JQuery 提交错误之前将其发布到此处进行讨论。

考虑这个 fiddle :

http://jsfiddle.net/tWPS6/2/

我使用 HTML 设置一个输入的值属性，另一个使用 Javascript 设置。然后，我要求 JQuery 选择空输入(值 == ""的输入)。它返回长度为 1(其中的一个输入是#input2)。

就好像这个空属性选择器是根据原始 HTML 中输入标记的原始值而不是当前值进行选择，即使使用任何其他方法检查 value 属性(例如 .value 或 .val) ()) 会告诉我它实际上不是空的。

这似乎是 JQuery 中的一个错误。对吗？

Answer 1

首先也是最重要的:

这不是 jQuery 中的错误。

某个元素之间存在显着差异 属性:

var attr = element.getAttribute('foo');

和元素属性:

var prop = element.foo;

This answer布局非常好 - 简而言之，属性与属性是困惑的，浏览器并不总是能正确理解，但是you almost always want to use the property, not the attribute when working with the DOM .

Forget about attributes. You nearly always want a property, not an attribute. Where both a property and an attribute with the same name exists, the property always represents the current state while the attribute (in most browsers) represents the initial state. This affects properties such as the value property of <input> elements.

---

如果您现在了解了属性 cluster!@#$，您应该会明白这是怎么回事。

选择器'input[value=""]'是一个属性选择器。这意味着它不是属性选择器。在您的示例的两轮中，$('input[value=""]')仅匹配<input id="input2" value=""/> ，因为该元素(并且只有该元素)是:

• 有 value属性，并且
• 那个value属性等于空字符串。

.val()设置<input>元素的 value 属性，而不是 value 属性。顾名思义，属性选择器匹配元素的属性，因此如果属性没有更改，它当然不会选择任何不同的内容。

此外，jQuery 在幕后做了各种奇特的事情:

• 提供跨浏览器的一致行为，并且
• 提供与文档一致的行为，并且
• 特别是 .attr() (其中有 quite the checkered past )可能非常难看。

---

哦，最后一个链接:John Resig on jQuery 1.6 and .attr() 。 阅读它。