Ymai a écrit :Kaze a écrit :Je déconseille vivement l'utilisation de « document.write() » en JavaScript, pout tout un tas de raisons.
Ma curiosité me pousse à en demander un peu plus
Québec a écrit :La méthode de Kaze a l'air intéressante. Outre le fait qu'il s'agit d'un chemin différent pour arriver au même résultat, quel serait l'avantage de son approche d'un point de vue «technique» (ie.: la lisibilité du code; son économie, sa «transparance» pour les différents navigateurs, etc.).
Il y a toujours plusieurs chemins pour arriver à un résultat. D'une manière générale, les développeurs pratiquent le « ni dieu ni maître », mais pour ce qui est du principe de séparation du code et de l'interface : pas touche, c'est sacré ! Et les hérétiques sont rapidement excommuniés par le chef.
Pour le cas où l'on veut modifier dynamiquement une partie de la page web, que ce soit en PHP ou en JavaScript, on a deux possibilités :
- faire générer du code HTML par un script PHP ou JS, par exemple :
Code : Tout sélectionner
<script type="text/javascript" language="javascript">
{
document.write('<img src="photindex/'+ Math.round((Math.random()*3)+1)+ '.jpg" alt="image aléatoire" ');
}
</script>
Code : Tout sélectionner
<?php
echo('<img src="photindex/' . rand(1,3) . '.jpg" alt="image aléatoire" ');
?>
- utiliser du bon vieux HTML en laissant PHP ou JS modifier des attributs :
Code : Tout sélectionner
<img id="random" src="photindex/1.jpg"alt="image aléatoire"/>
Code : Tout sélectionner
<img src="<?php echo("photindex/" . rand(1,3) . ".jpg"); ?>" alt="image aléatoire" />
La première méthode c'est le coté obscur : plus rapide à priori, mais ça mélange l'interface (le code HTML) avec la logique (le code PHP ou JS). C'est une erreur qu'on regrette très vite quand le site s'étoffe. Ça ne permet pas de réutiliser le code dans d'autre pages sans copier/coller, les améliorations ou modifications de code doivent être répercutées manuellement partout, et on ne peut pas utiliser CaScadeS pour styler l'image.
La deuxième méthode est celle de tout padawan qui se respecte. L'effort initial de séparer clairement la présentation de la logique est rentabilisé dès que l'on veut apporter des modifications à la page : on peut déplacer et styler l'image aléatoire à la souris, directement sous KompoZer, sans avoir à passer par le code source. La structure HTML reste valide même si une erreur s'est glissée dans le script. Quand on doit dépanner une page, tout est plus simple.
Les webmestres en général prêtent peu d'importance à ces considérations de développeur, et sont nombreux à faire du code bien pourri, ce qui commercialement se défend : il est très difficile de reprendre un projet codé « coté obscur » par un concurrent, et peu importe le temps nécessaire pour faire une correction, puisque c'est le client qui paye.
Mais je constate de plus en plus qu'ils finissent par comprendre que ces bonnes pratiques (que les développeurs ont admises depuis 20 ans ou plus...) sont finalement nécessaires et rentables. Ceci dit tu fais bien comme tu veux, comme tu l'écris il y a toujours plusieurs façons d'arriver à un résultat, je ne fais là que proposer une méthode qui permet de profiter au mieux de KompoZer (à mon humble avis).
Les deux méthodes décrites ci-dessus aboutissent au même code HTML, le résultat sera donc rigoureusement équivalent pour le visiteur : c'est uniquement pour le webmestre que ça a un intérêt.
PS : acessoirement, la méthode que je propose a le mérite d'afficher une image même si le visiteur a désactivé JavaScript.
PPS : dans tous les cas, PHP est préférable pour modifier dynamiquement des bouts de code HTML (il est fait pour ça). En JavaScript on *peut* modifier du code HTML dynamiquement, mais dans ce cas je recommende plutôt d'utiliser des méthodes DOM (cf. document.getElementById()) voire de l'Ajax pour les plus chevronnés, plutôt qu'un document.write().
