Fonction à la hauteur de document.write

Version imprimable

Bonjour

J'essaye de créer une version sur mon site pour ceux qui n'ont pas javascript activé. Mais je remarque que document.write est plus performant que innerHTML, seulement j'ai vu que document.write était à proscrire. Je dis + performant car il demande moins de ligne à écrire en code, et surtout affiche l'élément tel quel <= oui par exemple:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 <ul id="maintab" class="shadetabs"> <li class="selected"> <script>  </script> <noscript><a href="index.php?pg=profil&tc=infos" rel="tcontent1"></noscript> Mon compte</a></li> <li><a href="#" rel="tcontent2">onglet 2</a></li> <li><a href="#" rel="tcontent3">onglet 3</a></li> <li><a href="#" rel="tcontent4">onglet 4</a></li> </ul>
Ce sont des onglets. ça marche parfaitement. mais si je fais comme ça:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <ul id="maintab" class="shadetabs"> <li class="selected" id="content1js"> <script>  </script> <noscript><a href="index.php?pg=profil&tc=infos" rel="tcontent1"></noscript> Mon compte</a></li> <li><a href="#" rel="tcontent2">onglet 2</a></li> <li><a href="#" rel="tcontent3">onglet 3</a></li> <li><a href="#" rel="tcontent4">onglet 4</a></li> </ul>
et bien le lien s'affiche, mais il n'est pas cliquable, et n'hérite pas de la classe parent. (c'est un menu à onglet)

Alors comment faire pour remplacer document.write efficacement ?

Bonsoir,
innerHTML est à peine mieux que document.write, il te faut passer par les méthodes de constructions dynamiques comme createElement, createTextNode

un petit exemple

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE HTML>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[Création dynamique]</title>
</head>
<body>
<div id="ici"></div>
<script type="text/javascript">
  var oDest = document.getElementById('ici');
  var oLien = document.createElement('A');
  var oText = document.createTextNode('le texte du lien');
  oLien.appendChild( oText);
  oLien.href = "nom_page.html";
  oDest.appendChild( oLien);
</script>
</body>
</html>

06/01/2012, 00h37
flozza

Merci NoSmoking! ça ressemble à ce qu'il me faut.
C'est du DOM c'est ça ?
06/01/2012, 10h51
RomainVALERI

Citation:

Envoyé par flozza

C'est du DOM c'est ça ?

Ouep ^^

Conclusion double :
> document.write à bannir
> innerHTML à utiliser le moins possible, ou disons à réserver pour des cas spécifiques ou il y a des raisons explicites pour ne pas utiliser les méthodes DOM :)
06/01/2012, 23h21
flozza

Merci de votre aide à tous les deux. Même si je ne peux pas l'implémenter partout, ça fait quand même du bordel de mettre des balises identifiées partout.
07/01/2012, 11h13
RomainVALERI

Citation:

Envoyé par flozza

ça fait quand même du bordel de mettre des balises identifiées partout.

8O ... ? Wow.... celle-là il fallait la trouver :mrgreen:

Oui, tu as raison, elle est mal tenue cette ville :nono: on va virer toutes les plaques de noms de rue et les numéros sur les maisons ça sera moins le bordel :aie: