Relevent jsFiddle: http://jsfiddle.net/julianlam/eLs9E/
For some reason, given the dataset shown in the fiddle, when I try to grab all of the elements with the data-interest-id property, among the seven li elements, I get the Number "7" as well.
The two are related, as if I add another li element, the number is "8".
Any particular reason this is happening?
The object returned from .getElements, in addition to its results, includes a length property.
When use the Object.each() function you iterate through all the properties. For example: If you change the .each to
Object.each(meh, function(element, key) {
console.log(element+"-"+key);
});
You'll see that the console.log() within the each() function will show "length" as its key whereas the rest will have an index.
Related
With this $("div.modal-window.modal-progress a") selection I get two elements:
How to get the first selected object from the group and display it own property?
I tried this console.log($("div.modal-window.modal-progress a")[0].baseURI) but I get undefined.
Each of the selected in the set has baseURI:
And how one is able to iterate over all in the set?
$("div.modal-window.modal-progress a:first")
might just do it. Do post more of your code though so we can see the structure.
Use first() function of JQuery as
$("div.modal-window.modal-progress a").first()
Given a jQuery object that represents a set of DOM elements, the .first() method constructs a new jQuery object from the first element in that set.
$("div.modal-window.modal-progress a")[0] should get you the first item.
You get an undefined result because the property baseURI might not be defined in the first element.
If you want to get a jQuery object from the first selection, you can wrap the selected element by a $ like this:
$($("div.modal-window.modal-progress a")[0])
EDIT: After the OP changed his question:
You might want to use jQuery.each to iterate over all the elements that match your selector.
$("div.modal-window.modal-progress a").each(function() {
console.log($(this).prop("baseURI"));
});
I am using linqjs and I have one array full of ids to include in a list, and an array full of complex objects which have a property userId.
Problem is when I do an intersection it never seems to return anything, however there is very little information around the compareSelector.
So here is an example of what I am doing:
enumerableOfUsers.intersect(listOfIdsToInclude, "$.userId");
So in the above example enumerableOfUsers would be an existing enumerable created from an array of users (which contain the userId field), the listOfIdsToInclude is an array of id values, like ["12345", "213213", "2124"] etc.
The intersect seems to work but never returns anything and I know the userIds match so am I doing anything wrong here?
The thing is that the compare selector is applied to items of both the first and second sets. The second set is a list of ids already so the compare selector doesn't apply. The projection yields undefined values which will always result in no results found.
You need to apply the selector only to the first set of values. Try this instead:
// using linqjs 2.x syntax
var query = enumerableOfUsers.Select("$.userId").Intersect(listOfIdsToInclude);
I recently came across these codes while learning how to program an animated gallery and have no idea what they mean:
var items = $('#gallery li'),
itemsByTags = {};
items.each(function(i){
var elem = $(this),
tags = elem.data('tags').split(',');
//Add data attribute for quicksand
elem.attr('data-id',i);
I know that the var items = $('#gallery li'),itemsByTags = {};means that I am grabbing the list ID through jQuery and then setting a variable named itemsByTagsto an empty string.
After which items.each is a loop that is design to run through all the lists. But i have no idea what is function(i)? Why is there an i inside the function? What is this ithing?
Also, what does $(this) mean? Does it refer to the items?
Lastly, what does the .attr() mean with the i inside?
Just as a warning, questions like this one aren't very highly regarded on Stack Overflow because they can be answered by visiting a single page about the function you're using, which in this case would be the documentation for the jQuery .each() function. Questions like this one are often downvoted and never get an answer, so before posting a question, you should always check the documentation for the code or libraries that you are using to see if your question may already be answered there.
With that out of the way, here are a couple of points that should help answer your questions:
itemsByTags = {}; sets the variable to an empty object, not a string. This variable is not used in the code you provided, though, so it's not very relevant to the question at hand.
items.each(function(i){ is, as you noted, a function designed to loop through an array of items. Each functions normally output two different values, a key and a value. In this case, however, only one variable is supplied in the function call, and so the function will only receive the first value, which is key. The key is the 0-based index of the number of the item you are on. This number will increase by 1 each time you move to the next item in an array. A different way of explaining this would be to say that array[key] would return the value in array at item number key.
$(this) is jQuery's way of referring to the object currently being retrieved from the array. Because var items = $('#gallery li') retrieves a list of all of the objects in the page that match the selector #gallery li, $(this) refers to the actual object in the page whose array element is being retrieved. $(this) can be modified and acted on in the same way as if you targeted it using a normal selector like $('#gallery li').eq(i).
You may have determined by now exactly what the last line is doing. $(this).attr('data-id',i); finds the current array item's element in the page and sets its data-id attribute to its 0-based index relative to its siblings. If you iterate through the array in this way, the 6th (just for example) $('#gallery li') element's data-id attribute would be changed to 5.
Hope this is helpful!
In the javascript, there are two arrays:tags[] and tags_java[]. I use .splice to delete certain items, which of the same index in the two arrays. The tags[] works fine, but tags_java doesn't, it seems always delete the last item.
Here is the code and the jsfiddle link.
var tag = $(this).text();
var index = $.inArray(tag, tags);
tags.splice(index,1);
tags_java.splice(index,1);
Nah, both don't work, because you're not actually finding the correct index of your tag.
Why not? Because $(this).text() includes the delete mark you added, × - e.g. "Morning×". Since that's not in your tags array, index will be -1. tags.splice(-1, 1); will remove 1 item from the end of the array.
In general, it's never a good idea to use presentation text (i.e. the text of your tag element) as data (e.g. using that text as a lookup value in an array). It's very likely that it'll be broken when something changes in the presentation - like here. So a suggestion would be to store the data (what you need to look up the tags) as data - e.g. using the jQuery-provided data() API - even if it seems redundant.
Here's a quick example - just adding/replacing two lines, which I've marked with comments starting with "JT": JSFiddle
Now, instead of looking up by $(this).text(), we're looking up by the data value "tagValue" stored with $(this).data() - that way, the lookup value is still bound to the element, but we're not relying on presentation text.
If the tag is not in the tags array, $.inArray will return -1, which would then cause the last item to be deleted.
You have to make sure that the item is actually in the array.
I'm wondering, why do some elements appear like an array and others like HTMLSpanElement. I've attached a picture as I'm not sure how to describe this otherwise.
The following log is made via
log(returner);
log(returner[0]);
Is returner a jQuery object as a result of $() ? $() will always return an array, even if there is one or zero elements inside of it. Without specifying an index in your first console.log, the entire contents of the array are outputted. In the second console.log, you include an array index, so only the element matching that index is outputted.
Because the element that appears like an array IS an array - it's an array of DOM element objects (HTMLSpanElement, etc).
When you log the first element of the array with returner[0], that element is a DOM object, so it logs it as an object.
Because (it looks like) returner is not an element, but an array of elements.