I need to create a grid of DIVs (all DIVs will have same dimensions) and set them a defined names, colors, positions etc. Which is the most relevant/easiest/fastest method of doing this according to you?
Any answers will be appreciated!
Add a comment
|
3 Answers
An iterator (for loop would work) that uses the append method to add a bunch of divs.
If each one has slight differences, track the differences in a map or something the iterator can also access.
1 Comment
Greg Pettit
Jai actually took the time to provide some code; feel free to upvote and accept his answer (if it works for you!) instead. ;)
No doubt iterator in javascript like most used and most favorite for(){} loop is fine and in terms of jQuery .each() is what you are looking for.
using for loop with jQuery:
for(var i = 0; i<=10; i++){
$('<div />').addClass('sameDiv').attr('id','div'+i).appendTo('body');
}
CHECK THIS OUT
1 Comment
Greg Pettit
Ayup. Updated the fiddle with a "properties in an array" proof of concept. You could use something like an array of objects full of properties if you wanted: jsfiddle.net/UNCMY/3
The other answer is correct, but I prefer the jQuery element creation syntax:
for (var i = 0; i <= 10; i++) {
$('<div />', {
'class' : 'sameDiv',
'id' : 'div' + i
}).appendTo('body');
}
Fiddle : http://jsfiddle.net/K5ERR/
