CODEWITHSUNDEEP
javascriptjquerycsshtml
user1778595
user1778595

Reputation: 29

how do I get elements by loop, html?

I want to do something like:

var i=0;

while(i<20)
{
  var temp= document.getElementById(''+20);
  $(temp).hide();
  i++;
}

Can I do that? I tried, but it didn't work.

Upvotes: 0

Views: 109

Answers (5)

Selosindis
Selosindis

Reputation: 544

You have actually created an infinite loop. Since you don't change the value of i, it will be 0 forever, and thus always < 20.

You should also give your elements ids that aren't just numbers (as that won't work).

<div id='something1'></div>

Try a for loop, like this:

// Wait for the page to finish loading.
window.onload = function() {
    // Run your loop.
    for(var i = 0; i < 20; i++) {
        var temp = document.getElementById('something' + i);

        // Do stuff with temp.
    }
}

// Or, with jQuery
$(document).ready(function() {
    // Run your loop.
    for(var i = 0; i < 20; i++) {
        var $temp = $('#something' + i);

        $temp.hide();

        // Or, if you're only hiding...
        $('#something' + 1).hide();
    }
});

Upvotes: 0

VeXii
VeXii

Reputation: 3109

if you have a collection of elements where id="htmlID1-20" you can change the code to somthing like this:

var i = 20
  , elems = [] // empty array to keep the elements
while(i--){  //this trick reduces the variable i by 1 each time the loop runs, stopping at 0
    elems.push(document.getElementById("htmlID"+i)) //collect the dom elements and push a refrance to it in the array
}
console.log(elems)

it is not recomendet to create variabels or functions inside loops

Upvotes: 0

sachleen
sachleen

Reputation: 31131

ID's can't begin with a number, so you have to have something before the count.

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

So prefix it with something else to make it valid, I chose "example_".

The other problem is that you're always trying to get the element with "20" in the ID. You want to get all of them so you have to use your loop counter, i.

Also note that the counter goes from 0 to 19 (when i = 20, i<20 is FALSE) so keep that in mind so it matches with your markup.

JS:

var i=0;

while(i<20)
{
  var temp= document.getElementById('element_' + i);
  $(temp).hide();
  i++;
}

with your markup looking like:

<div id="element_0">first</div>
<div id="element_1">second</div>
<div id="element_2">foo</div>
...
<div id="element_19">bar</div>

Upvotes: 0

Mathlight
Mathlight

Reputation: 6653

Try this:

var i = 0;

while(i < 20){
    var temp = document.getElementById('Elid_'+i);
    // DO STUFF
    i++;
}

You had an invinite loop (i was always smaller then 20) Also did you use the static number 20 instead of i. the more or less dynamic number And as mentiod else where, an ID can't start with only an number...

Upvotes: 0

Cymen
Cymen

Reputation: 14419

Yes, example:

for (var i=0; i < 20; i++) {
  var temp = document.getElementById(i);
  console.log(temp);
}

A working sample: http://jsfiddle.net/bqF9T/

But as noted in the comments, be sure to use valid IDs as what happens to work in Chrome may not in other browsers if the HTML is invalid.

Upvotes: 1

Related Questions