Sarà capitato spesso di trovare questo misterioso alert durante l’esecuzione di una pagina su IE6 o IE7: la pagina viene eseguita, mostra il suo contenuto e poi puff, scompare!

La spiegazione è quanto mai immediata: un javascript sta cercando di modificare il contenuto dell’oggetto padre rispetto alla chiamata della funzione javascript in questione.

Cosa significa?

  1. <body id="mybody">
  2. <div>
  3. <script language="javascript">
  4. document.getElementById(‘mybody’).innerHTML=‘Hello World!’;
  5. </script>
  6. </div>
  7. </body>

Un javascript dentro il div vuole modificare un attributo del padre (diretto o no che sia).

Come risolvere?

usare l’evento onload del body per modificare se stesso.

Firefox (<= 2.0.0.7), parsando la risposta XML di una richiesta con XMLHttpRequest, tronca il textNode a 4096k.

E’ un dato di fatto e ne ho le prove (bestemmie e sangue amaro fino alle 8 di sera un giorno in ufficio). Non so perchè ma è così, e sembra che il comportamento sia condiviso anche da Opera (9.23, la versione che ho attualmente e su cui l’ho riscontrato). Il problema su IE6 e IE7 non si presenta.

Quindi cosa ne fa Firefox degli altri bytes rimanenti del textNode? Alloca N childNodes.

Esiste una soluzione a questo problema, cioè normalizzare l’oggetto XML creato con la responseXML con il metodo normalize()

  1.  
  2. function func()
  3. {
  4.         var xmlhttp = new XMLHttpRequest();
  5.         xmlhttp.open(‘GET’, url, true);
  6.         xmlhttp.onreadystangechange = function()
  7.         {
  8.                 if (xmlhttp.readyState == 4)
  9.                 {
  10.                         if (xmlhttp.status == 200)
  11.                         {
  12.                                 var doc = xmlhttp.responseXML;
  13.                                 var html = ;
  14.                                 if (doc.evaluate())
  15.                                 {
  16.                                         doc.normalize();
  17.                                         html = doc.getElementsByTagName(’string’)[0].childNodes[0].nodeValue;
  18.                                 }
  19.                                 else
  20.                                         html = doc.text;  
  21.  
  22.                                 return html;
  23.                         }
  24.                 }
  25.         }
  26. }

tip: la funziona evaluate()  è utile per capire se si è sotto Firefox\Opera o Internet Explorer e differenziare il metodo di interrogazione dell’XML (perchè ovviamente non sono uguali :) )

Nell’ambito di applicazioni complesse mi è stato necessario suddividere la libreria js in più files (per comodità di modifica, per la dimensione del file da far scaricare al client, ecc ecc). Ma, poi, i file js da portarsi dietro sono diventati tanti.

Allora come per i css (@import another.css) e per i comuni linguaggi come ASP e PHP che usano gli include, ho usato questo:

# functions.js

  1. function include(jsname)
  2. {
  3. var h = document.getElementsByTagName(‘head’).item(0);
  4. var script = document.createElement(’script’);
  5. script.src = jsname;
  6. script.type = ‘text/javascript’;
  7. h.appendChild(script)
  8. }
  9.  
  10. include(’subfunctions.js’);

#subfunctions.js

  1.  
  2. function func()  { }

# page.html

  1.  
  2. <script language="javascript" type="text\javascript" src="functions.js"></script>
  3. <script language="javascript">
  4. func();
  5. </script>

Et voilà!

Lo script incluso sarà posizionato in coda al tag <head></head> dell’html generato al client.

Chi sviluppa in .NET con Visual Studio 2003 avrà avuto la necessità di effettuare del debug javascript… Finchè si usava Explorer 6 non c’erano grossi problemi, anzi, ho sempre considerato il debugging client di vs 2003 una manna dal cielo…

Installando Explorer 7 ho avuto una spiacevole sorpresa… Il debug js non funziona più e VS mi notifica questo simpatico messaggio “There is no source code available for the current location.”

Googlando a destra e a manca ho scoperto che è un bug noto e la stessa Microsoft sui forums di supporto ufficiali (nel novembre 2006) conosceva il problema e stava “lavorando per correggerlo”…

Esistono quattro workaround per questo problema:

- spostare il codice js da debuggare in un file esterno e includerlo nella pagina
- usare Microsoft Script Editor incluso nella suite di Office 2003
- richiedere a Microsoft una fix specifica documentata nella kb 930873 (solo con VS2003 SP1)
- usare il debug client di Visual Studio 2005

Magra consolazione.

Niente paura però, il debug js con Explorer 7 e Visual Studio 2005 funziona perfettamente.