Is it possible to define multiple variables with a single jQuery chain?
var sectionTable = jQuery("#sectionsTable");
var sectionTableRows = sectionTable.find("tr");
var sectionTableColumns = sectionTableRows.find("td");
I don't know what the syntax would be if it is possible but if you took the 3 variables above how could you chain them and would it be considered good practice?
Many thanks
Chris
EDIT: Wow, thanks for all the comments. Sorry for being vague, what I was after was a better way (if one exists) of defining child variables from a parent variable. That's why I thought of using the chain and wondered if a way existed. Thanks for the great advice.
If you really want to, anything is possible :
Of the top of my head, you could try to do something like this :
var sectionTable,
sectionTableRows,
sectionTableColumns = $('td', (sectionTableRows = $('tr',(sectionTable = $('#sectionsTable')))));
Another ideea would be to build a mini-plugin that assigns the current jquery object to a certain field of an object :
jQuery.fn.assignTo = function(variableName,namespace){
var ns = namespace || window;
ns[variableName] = this;
return this;
}
With this peace of code you could do the following :
var sections = {};
jQuery("#sectionsTable")
.assignTo('sectionTable',sections)
.find("tr")
.assignTo('sectionTableRows',sections)
.find("td")
.assignTo('sectionTableColumns',sections);
console.log(sections.sectionTable);
console.log(sections.sectionTableRows);
console.log(sections.sectionTableColumns);
Of course, if you do not specify any namespace, the variables will be global (will be attached to the window object);
Any way, I do not encourage you to use these examples, because it doesn't make very much sense to worsen your code's readability in favour of fewer equal signs and var
declarations.
I maybe don't really understand what you want or need, but you can chain any function for a jQuery wrapped set and "end" it and therefor "go back" to the previous set. For instance:
jQuery("#sectionsTable").css('background-color', 'red')
.find('tr').css('background-color', 'yellow')
.find('td').css('background-color', 'black')
.end() // back to 'tr'
.doSomething()
.end() // back to '#sectionsTable'
.doSomething();
However, this would imply that you only need to access those elements once. If you need to access them later in your code, you always should store the results references in variables for several performance reasons.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With