JS Tablice i zmiana elemntow na stronie

Question

Witam. Obejrzałem odc. 3 kursu JS i psotanowiłem trochę zmodyfikować tą grę (wisielca). Postanowiłem zrobić grę, w której po obrazku zamalowanego piłkarza uzytkownik musi odgadnąć kto to jest. To co mogłem, zrobiłem przy pomocy kursu jednak teraz mam kilka pytań. 

http://codepen.io/czujek22/pen/OWKqwW

Chcę zrobić kolejnych piłkarzy do odgadnięcia. Czyli zmiana zdjęcia i hasła po odgadnięciu poprzedniego. I jak obrazy orientuję się jak zrobić to nie wiem co z hasłami.

Podejrzewam, że najlepiej wszystkich piłkarzy upchnąć do tablicy.

var haslo = new Array(5);

haslo[0]="Cristiano Ronaldo";
haslo[1]="Gerard Pique";
haslo[2]="Eden Hazard";
haslo[3]="Romelu Lukaku";
haslo[4]="Marc-Andre Ter Stegen";

Tylko, że np jest linijka

if (haslo.charAt(i)==" ")
    haslo1 = haslo1 + " ";

I jak odwołać się do każdego znaku, każdego z haseł. Zagnieżdżona pętla ?

Answer 1

Pierwsza litera pierwszego hasła: haslo[0][0]
Druga litera pierwszego hasła: haslo[0][1]
...

o to chodzi?

Comments

Słyszałem w odcinku, że do łańcuchowych tablic nie powinno się używać tablica[X]

Answer 2

Czemu w taki sposób to nie wychodzi ?

var haslo = ['CRISTIANO RONALDO','GERARD PIQUE','EDEN HAZARD','MARC-ANDRE TER STEGEN'];
 
var dlugosc[4];
 
for(i=0;i<4;i++)
{
  dlugosc[i] = haslo[i].length;
}
 
var licz=0;
var ile = 8;
var numer=0;
 
var haslo1[0] = "";
var haslo1[1] = "";
var haslo1[2] = "";
var haslo1[3] = "";
 
for(j=0;j<4;j++)
{
  for(i=0; i<dlugosc; i++)
  {
    if (haslo[j].charAt(i)==" ")
      haslo1[j] = haslo1[j] + " ";
    else
    haslo1[j] = haslo1[j] + "-";
  }
}
 
function wypisz_haslo()
{
  document.getElementById("plansza").innerHTML = haslo1[licz++];
}
 
window.onload = start;
 
var litery = new Array(36);
 
litery[0] = "A";
litery[1] = "Ą";
litery[2] = "B";
litery[3] = "C";
litery[4] = "Ć";
litery[5] = "D";
litery[6] = "E";
litery[7] = "Ę";
litery[8] = "F";
litery[9] = "G";
litery[10] = "H";
litery[11] = "I";
litery[12] = "J";
litery[13] = "K";
litery[14] = "L";
litery[15] = "Ł";
litery[16] = "M";
litery[17] = "N";
litery[18] = "Ń";
litery[19] = "O";
litery[20] = "Ó";
litery[21] = "P";
litery[22] = "Q";
litery[23] = "R";
litery[24] = "S";
litery[25] = "Ś";
litery[26] = "T";
litery[27] = "U";
litery[28] = "V";
litery[29] = "W";
litery[30] = "X";
litery[31] = "Y";
litery[32] = "Z";
litery[33] = "Ż";
litery[34] = "Ź";
litery[35] = "-";
 
function start()
{
  var tresc_diva = "";
 
  for(i=0; i<=35; i++)
  {
    var element = "lit" + i;
    tresc_diva = tresc_diva + '<div class = "litera" onclick="sprawdz('+i+')"id="'+element+'">'+litery[i]+'</div>';
    if ( (i+1)%6==0 ) tresc_diva = tresc_diva + '<div style="clear:both;"></div>';
  }
 
  document.getElementById("alphabet").innerHTML = tresc_diva;
 
  wypisz_haslo();
}