Best Practice in JavaScript e xHTML
Giusto un mese fa, in Smashing Magazine, è comparso un post (che usa come “base della discussione” anche la libreria JavaScript jQuery) interessante che riporta una serie di linee guida nell’uso di JavaScript: in particolare viene posta molta attenzione sulla possibilità che il browser non sia in grado di eseguire il codice JavaScript (come spesso accade in molti PDA).
La mia attenzione è stata catturata in particolare dalla regola numero 2: NEVER Depend on Javascript.
Bad practice
<script language="javascript">
var now = new Date();
if(now.getHours() < 12)
document.write('Good Morning!');
else
document.write('Good Afternoon!');
</script>
Soluzione proposta
<p title="Good Day Message">Good Morning!</p>
var now = new Date();
if(now.getHours() >= 12)
{
var goodDay = $('p[title="Good Day Message"]');
goodDay.text('Good Afternoon!');
}
Non sono molto d’accordo circa il best practice proposto, motivo: una parte dei contenuti viene ancora generata dinamicamente via JavaScript , sottraendo quindi questi ultmi all’indicizzazione da parte dei motri di ricerca (ricordo che i motori di ricerca non “eseguono” gli script presenti o “invocati” nella pagina). In sostanza, come sostiene da tempo il mio caro amico Francesco Boschian: tutti i contenuti devono essere sempre presenti nella pagina, non generati “dinamicamente” via scripting (vedere come buon esempio il sito della Apple).
Qui di seguito propongo una soluzione molto “artiginale e grezza”, ma che nella sua modestia rappresenta un valido workaround per aggirare la cosa.
<input type="hidden" id="str1" value="Good morning!" /> <input type="hidden" id="str2" value="Good afternoon!" /> <p title="msg">Good Morning!</p>
var now = new Date();
if(now.getHours() >= 12)
{
var toSet = $('#str2').value;
}
else
{
var toSet = $('#str1').value;
}
var msg = $('#msg');
msg.text(toSet);
Evidente, purtroppo, la ripetizione della stringa “Good morning!”. Se però lato server possiamo sfruttare famework quali PHP o Asp.Net, il codice può diventare assai più “gradevole alla vista” .
