getElementById() per un elemento creato con createElement() in Firefox

**Nillus** · 18-02-2009, 07:21

Salve a tutti. Questo è il mio primo post, perciò se ho sbagliato sezione scusatemi.

Ho cercato molto su internet il mio problema, e anche su questo forum, ma non ho trovato una soluzione, per cui propongo il mio caso specifico.

Ho creato un elemento div dinamicamente con javascript tramite la funzione createElement(). Ho successivamente attribuito al div vari attributi, tra cui l'ID con setAttribute(), e ho inserito il div creato nell'albero del documento con appendChild().

Quando richiamo il div specifico con getElementById(), con IE funziona, mentre con Firefox continua a restituirmi "null", come se avessi richiesto un oggetto con ID inesistente. E' tutta la notte che ci lavoro e non ne sono venuto a capo... non è che qualcuno ne sa qualcosa?

Ringrazio in anticipo per ogni suggerimento...

**fcaldera** · 18-02-2009, 10:28

Benvenuto

1) la sezione è assolutamente corretta

2) però bisogna che ci mostri il codice javascript che hai usato e sapere che id hai assegnato (magari hai usato una parola riservata per firefox)

**Nillus** · 18-02-2009, 18:58

Scusate per il ritardo nella risposta...

Si certo, posto il codice, ma non credo sia un problema di keyword:

Codice PHP:


//-------  Questo è il contesto html degli script, per inciso, HTML 4.01 strict



<html>

<head>

<link rel="StyleSheet" type="text/css" href="src/titles.css">   

<script type="text/javascript" src="src/fs.js"></script>         

<script type="text/javascript" src="src/Initialize.js"></script>     

</head>





<body>

<!--

Corpo del body

-->

<script type="text/javascript" src="src/Second.js"></script>



</body>

</html>







//-------------------Questo è il file initialize.js

var x=10;

var y=10;

var StartX=50;

var StartY=300;



//Creazione dinamica di una matrice x per y

var matrice = new Array(x);

for (i=0;i<10;i++)

    matrice[i]=new Array(y);



//Inizializzazione della matrice

for (i=0;i<x;i++)

    for (j=0;j<y;j++)

        matrice[i][j]=10;

        



//------------------ Questo è il file second.js



document.getElementById("nome").select();//Imposto il focus su un form field



DrawImages();



function DrawImages()

{

var elem;

 for (i=0;i<x;i++)

     for (j=0;j<y;j++)

     {

         elem=document.getElementById("ImageAtX"+i+"y"+j);

         if (!elem)     //Verifico se esiste già un elemento con questo id

         {

            CreateDiv("MapLocationX"+i+"Y"+j, "", StartX+i*50, StartY+j*50, 50, 50);

            elem=document.getElementById("ImageAtX"+i+"y"+j);

         }

//Fa qualcosa per ricavare nomeimmagine da inserire in base ai dati contenuti nella matrice[][]

         elem.innerHTML="[img]images/"+nomeimmagine+".gif[/img]";  

     }

}



//------------------- CreateDiv() sta nel file fs.js:

function CreateDiv(id, content, x, y, w, h)

{

//x e y sono le posizioni assolute del futuro div, mentre w e h sono width e height



x+="";

y+="";

w+="";

h+="";



if (x.charCodeAt(x.length-1)<58 && x.charCodeAt(x.length-1)>47) x+="px";

if (y.charCodeAt(y.length-1)<58 && y.charCodeAt(y.length-1)>47) y+="px";

if (w.charCodeAt(w.length-1)<58 && w.charCodeAt(w.length-1)>47) w+="px";

if (h.charCodeAt(h.length-1)<58 && h.charCodeAt(h.length-1)>47) h+="px";



   var dv = document.createElement('div');



   dv.setAttribute('id', id);

   dv.setAttribute('name', id);



   document.body.appendChild(dv);



   if (w) dv.style.width = w;

   else dv.style.width = "50px";



   if (h) dv.style.height = h;

   else dv.style.height = "50px";



   dv.style.position = "absolute";



   if (x) dv.style.left = x;

   else dv.style.left = 0;



   if (y) dv.style.top = y;

   else dv.style.top = 0;



   dv.style.background = "#000";

   dv.style.border = "0px";



   dv.innerHTML = content;

}

Scusate le variabili in inglese... sapete, a forza di leggere libri e guide in inglese, io li commento anche i programmi in quella lingua!!!

**fcaldera** · 18-02-2009, 19:05

document.getElementById("nome").focus(); //Imposto il focus su un form field

**Nillus** · 18-02-2009, 19:21

Si, ma non funziona a volte, e poi quel campo deve necessariamente essere modificato perché il sito svolga la sua funzione, per cui ne seleziono direttamente l'intero contenuto così che risalti subito all'occhio il testo "Inserisci qui"...

**Nillus** · 18-02-2009, 23:27

A parte quel select(), invece di focus(), sapete dirmi qualcosa sul perché Firefox, a differenza di IE, non collega gli ID assegnati ad elementi creati dinamicamente con createElement()?

**fcaldera** · 19-02-2009, 00:26

se tu scrivi ad esempio

tuodiv = document.createElement('div');
tuodiv.id = 'tuoid';
document.body.appendChild(tuodiv);

questo funziona egregiamente anche in FF

**Nillus** · 19-02-2009, 01:22

Mmh, no non mi funziona nemmeno in quel modo...

**fcaldera** · 19-02-2009, 01:31

allora c'è un errore altrove perchè questo esempio funziona senza problemi

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="it" xml:lang="it">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <meta http-equiv="imagetoolbar" content="no" />

        <title>Title of the page</title>
    </head>

<body>
    <script type="text/javascript"> 
    tuodiv = document.createElement('div');
    tuodiv.id = 'tuoid';
    tuodiv.innerHTML = 'ciao';
    document.body.appendChild(tuodiv);
    </script>
</body>
</html>

**Nillus** · 19-02-2009, 02:39

Hai ragione, il tuo esempio funziona correttamente. Tuttavia non sono riuscito a capire perché quando nel mio caso eseguo, coinvolgendo vettori e inclusioni di file .js, la stessa operazione non ottengo lo stesso risultato. Potrebbe darsi che ci sia qualche differenza in come vengono gestiti i vettori di vettori tra i due browsers, oppure vengono gestite differentemente le inclusioni degli script da file esterni, non so...

Cmq grazie mille lo stesso, e scusate per il disturbo

Discussione: getElementById() per un elemento creato con createElement() in Firefox

Strumenti discussione

Ricerca discussione

Visualizza

getElementById() per un elemento creato con createElement() in Firefox

Permessi di invio