Discussion :

[laurentSc]

Bonjour,

je découvre depuis peu (une semaine) le html5, et je voudrais l'utiliser pour faire un site web ; j'ai fait un essai qui ne fonctionne pas et je voudrais savoir si je suis sur la bonne piste.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<nav>
<a  href="#" onclick="display_page1()">Page 1</a>
<a  href="#">Page 2</a>
<a  href="#">Page 3</a>
</nav>
 
<section>
<article id="page1">
texte 1
</article>
<article id="page2">
...

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
function display_page1() {
getElementById('page1').style.display="block";
getElementById('page2').style.display="none";
getElementById('page3').style.display="none";
}

[NoSmoking]

Bonjour,

je découvre depuis peu (une semaine) le html5

certes mais tu n'as toujours pas pris le temps de te pencher sur le javascript

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

getElementById('page1').style.display="block"; // chercher l'ERREUR

[laurentSc]

Je l'ai trouvée . En effet, j'avais oublié un truc, mais n'y aurait-il pas moyen de simplifier mon code ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function display_none() {
for (i=1;i<4;i++)
	document.getElementById("page"+i).style.display="none";
}
function display_page1() {
	display_none();
	document.getElementById("page1").style.display="block";
}
function display_page2() {
	display_none();
	document.getElementById("page2").style.display="block";
}
function display_page3() {
	display_none();
	document.getElementById("page3").style.display="block";
}

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<nav>
<a  href="#" onclick="display_page1()">Page 1</a>
<a  href="#" onclick="display_page2()">Page 2</a>
<a  href="#" onclick="display_page3()">Page 3</a>
</nav>

[NoSmoking]

...

mais n'y aurait-il pas moyen de simplifier mon code ?

Je transfert sur le forum adéquat et t'engage à relire les réponses qui t'ont déjà été faites sur des sujets identiques.

[SylvainPV]

Déjà, à partir du moment où tu en viens à copier-coller des bouts de code et à ajouter des numéros 1, 2 et 3, tout développeur doté de bon sens écrit une fonction.

Ensuite, l'approche est mauvaise. Mettre toutes les pages dans le document et les montrer/cacher au besoin n'est pas utile et peu performant. Mieux vaut charger les pages au besoin en AJAX et les injecter dans le conteneur HTML de ta page (pas forcément body). C'est ce que font la majorité des frameworks de Single Page Applications.

[laurentSc]

Oui, en lisant ta réponse, j'ai tout de suite pensé à la fonction...Par contre AJAX, je connais pas du tout ; mais je pense faire simple, et pour ne pas tout mettre dans le même fichier, je vais mettre chaque page dans un fichier différent, et faire des include en PHP. Est-ce une bonne formule ?