When you use a selector in a jQuery call it may match more than one element. The results are returned as a jQuery object, which may contain a collection (array) of matched objects. Some methods, like attr
only work on the first element in the collection.
For example,
$('a')
will match all anchor tags in your document.
Now each of these will (may) have an href
attribute, but if you apply the attr
function to the results of that selector, it will only operate on the first element in the collection. If I have the following HTML.
<a href='#0'>Zero</a>
<a href='#1'>One</a>
and use
var href = $('a').attr('href');
Then the href
variable will have #0
as it's value despite the fact that the selector matches both of the anchors.
Making it somewhat more confusing is that usually the version of the method that assigns values, rather than read values, will work on all of the elements in the collection. For example,
$('a').attr('title','foo');
will assign foo
to the title attribute of both anchors in the collection. It's important to understand the differences in the way the various methods operate. See the jQuery API for more details on specific methods.
In your case, I suspect that f
is a variable that matches different selectors in different locations in the code (f
is a lousy variable name, btw, making it more verbose would probably help in understanding what the code does). That would explain why it has different values for the href
attribute in different locations. Of course, the values could also be changing precisely because you're setting them, but I would hope you would have understood if that were happening.