Wypisywanie serii znaków w innerHTML Opcje

[blackstone]

Witam, próbuje napisać skrypt który wpisany w pole tekstowe wyraz przedstawi w postaci ciągu literek - chodzi o to by każda litera znajdowała się w osobnym divie. Wszystko działa prawie dobrze ale problem polega na tym że skrypt wypisuje mi ostatnią literę wyrazu który zatwierdzam - javascript zamiast wyświetlić ciąg znaków wyświetla mi ostatni znak przerobiony przez skrypt. Wiem ze da się to zrobić za pomocą document.write() ale ta funkcja rozwala cały HTML , czy można to zrobić jakoś za pomocą innerHTML lub czegoś podobnego ? Gdy wyświetlam samą cyfrę dzieje się to samo, ale gdy zamiast innerHTML użyje document.write() to pokazuje się cały rząd cyferek prawidłowo.

[HTML] pobierz, plaintext 
var haslo=document.getElementById("tekst").value ;
var longer=haslo.length;
 
 
 
 
             for(i=-1 ; i<longer ; i++)
      {
 
var litera=haslo.charAt(i);
var box=' <div class="litera"> ' + litera  +  '</div>' ;
document.getElementById("field").innerHTML=box ;
      }
[HTML] pobierz, plaintext 

[kapslokk]

Zamień

[HTML] pobierz, plaintext 
document.getElementById("field").innerHTML=box ;
[HTML] pobierz, plaintext 

na:

[HTML] pobierz, plaintext 
document.getElementById("field").innerHTML+=box ;
[HTML] pobierz, plaintext 

albo najlepiej na appendChild wg tego: http://stackoverflow.com/questions/1151538...erhtml-bad-code

[blackstone]

Wziąłem w komentarz poprzednią część skryptu i zrobiłem coś takiego z wykorzystaniem apppendchilda ale tym razem nic nie działa ( jakby nie było w ogóle JS na stronie )

[HTML] pobierz, plaintext 
 
            for(i=-1 ; i<longer ; i++)
      {
 
var litera=haslo.charAt(i);
/* var box=' <div class="litera"> ' + litera  +  '</div>' ;
var litera=haslo.charAt(i);
box=' <div class="litera"> ' + litera  +  '</div>' ; */ 
 
var elm=document.getElementById("field") ;
div = document.createElement( 'div' );
div.textContent = litera;
elm.appendChild('div') ;
 
 
      }
 
[HTML] pobierz, plaintext 

[IProSoft]

Usuń apostrofy.

[JAVASCRIPT] pobierz, plaintext 
elm.appendChild( div )
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował IProSoft 4.05.2016, 07:34:36

[blackstone]

Działa prawie dobrze , mam tylko jedno pytanie - jak wykreować div o odpowiedniej klasie lub id css ? Próbowałem przypisać do createElement klasę ale gdy to zrobiłem to nie działało nic

[HTML] pobierz, plaintext 
div = document.createElement( 'div class="litera" ' );
[HTML] pobierz, plaintext 

[IProSoft]

Słabo kombinujesz

[JAVASCRIPT] pobierz, plaintext 
div.className = "klasa";
[JAVASCRIPT] pobierz, plaintext