CODEWITHSUNDEEP
javascriptarraysfor-loop
Shagohad
Shagohad

Reputation: 398

Javascript For loop wont work

This is my code:

<div class="div">
<div id="picture"><img src="news1.jpg" /></div>
<div id="picture1"><img src="news2.jpg" /></div>
<div id="picture2"><img src="news3.jpg" /></div>
</div>
<script type="text/javascript">

var element = document.getElementById("picture")
var element1 = document.getElementById("picture1")
var element2 = document.getElementById("picture2")


var zdjecia = new Array("element", "element1", "element2");
    for(var i=0; i < zdjecia.Length; i++)
        {   
         zdjecia[i].style.opacity="1";
        }
</script>

Could You give me some advise why that loop wont work ?. If I will find a problem, i will add settimeout and setTimeInterval to this, but at this moment i Can't find where is a problem with that loop.

Upvotes: -1

Views: 98

Answers (5)

fny
fny

Reputation: 33605

A Cleaner Approach

<div class="div">
  <div class="picture"><img src="news1.jpg" /></div>
  <div class="picture"><img src="news2.jpg" /></div>
  <div class="picture"><img src="news3.jpg" /></div>
</div>

<script>
  var zdjecia = document.getElementsByClassName('picture');
  for(var i = 0; i < zdjecia.length; i++) {
    zdjecia[i].style.opacity = '1';
  }
</script>

Here's what's wrong with your code

You need to loop through the actual DOM elements, rather than strings with the same variable names var zdjecia = new Array(element, element1, element2);.

Also, JavaScript is case sensitive, and you've accidentally capitalized length. zdjecia.Length should be zdjecia.length.

[1, 2, 3].Length // => undefined
[1, 2, 3].length // => 3

Also, it's preferable to use JavaScript's array literal (the square brace form) to instantiating a new array:

var zdjecia = [element, element1, element2];

JavaScript's array literal is more predictable than direct instantiation. Consider the following:

new Array(2, 1) // => [2, 1]
new Array(2)    // => [undefined, undefined]

Reserve the direct use of new Array() for preallocating space in an array.

Upvotes: 0

jfriend00
jfriend00

Reputation: 708026

The others have shown you the two coding mistakes you made (wrong capitalization on .length and using strings instead of direct variable references), but I'd suggest this change to your code:

var items = ["picture", "picture1", "picture2"];
for (var i = 0; i < items.length; i++) {
   document.getElementById(items[i]).style.opacity = 1;
}

Upvotes: 1

Tyler McGinnis
Tyler McGinnis

Reputation: 35286

You have a few minor errors. First, you're adding the elements as strings, not as the elements themselves. Second, you capitalized 'length' in your for loop. Don't do that. 

var zdjecia = new Array(element, element1, element2);

for(var i=0; i < zdjecia.length; i++){   
 zdjecia[i].style.opacity="1";
}

Upvotes: 0

Edgar Villegas Alvarado
Edgar Villegas Alvarado

Reputation: 18354

Corrected code:

var zdjecia = new Array(element, element1, element2);  //Array of objects, not strings
for(var i=0; i < zdjecia.length; i++)        //Use .length instead of .Length
    {   
     zdjecia[i].style.opacity="1";
    }

cheers

Upvotes: 0

thefourtheye
thefourtheye

Reputation: 239653

Instead of adding the elements as strings, add the elements as they are

var zdjecia = new Array(element, element1, element2);

and the length property should be accessed with zdjecia.length

Upvotes: 6

Related Questions