Conserver le style d'une valeur après exécution d'une fonction la modifiant

**mc.jordan** · 24/01/2013, 15h35

Bonjour,
Néophyte en JS, voici mon problème avec un exemple.
J'affiche une valeur dans un cadre avec un style prédéfini.
Je mets à jour cette valeur, grâce à une fonction par exemple, comment réafficher la nouvelle valeur sans perdre le style?

Exemple d'un code qui devrait illustrer mon problème:

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
17
18
19
20
21
22
23
24
25
26
27
28
29
 
<html>
<head>
	<title>Question de style en JS?</title>
	<style type="text/css">
<!--
		body {background-color:#424242; font-family: Arial, Helvetica, sans-serif; font-size:20pt;}
		.fjStylCadreBleu {background:#0066FF; height:70px; width: 30%; padding-top:12px; text-align:center; font-weight:bold; }
-->	
	</style>
 
<script language="javascript" type="text/javascript">
// j'écris un texte, ça pourrait être une valeur, une date...  dans un cadre;
	document.write('<div class="fjStylCadreBleu"> par exemple un texte affiché, ou une variable...  </div>');
// une fonction change ce texte ou comme évoqué ci-dessus recalcule une valeur, une date;
	function fjMiseAJour() {
		document.write('<div class="fjStylCadreBleu"> texte nouveau, ou variable recalculée, attendue avec le même affichage </div>');
		};
//mais mon code est tel que je perds le style du cadre de la feuille etc...;
//comment construire mon code pour garder les styles définis avant l'éxécution de la fonction?
</script>
</head>
<body>
<form name="Test" action="">
	<input type="button" value="Mise à jour"
	onClick="fjMiseAJour()">
</form>
</body>
</html>

J'espère que ma requête est claire...

Merci à vous

Jordan

**Bovino** · 24/01/2013, 15h40

Un peu de lecture : Comprendre document.write() en JavaScript.

**mc.jordan** · 24/01/2013, 16h04

Merci beaucoup Bovino.
En effet, c'est très éclairant, je pense avoir saisi la limite de la méthode document.write et ça ne m'étonne finalement pas. Dommage, je la trouvais rudement pratique.
Je vais "bucher", mais serait-il possible d'avoir une piste d'une méthode ad'hoc ou un exemple simple? Merci

**Bovino** · 24/01/2013, 16h11

Pour être franc, dans ton exemple, les deux lignes avec document.write() sont dégueulasses...
La première car elle écrit une <div> dans la partie <head> de la page et la seconde car elle écrase le document en cours.

Pour faire quelque chose de plus propre, il y a beaucoup de façons de faire...
Soit mettre la div directement dans la page dès le départ et modifier son contenu avec innerHTML, soit l'injecter plus tard avec createElement() et appendChild() et pareil, mettre à jour avec innerHTML.

**mc.jordan** · 24/01/2013, 16h29

Ok, merci beaucoup, je vais travailler le sujet.

Conserver le style d'une valeur après exécution d'une fonction la modifiant

JavaScript

Discussions similaires

Partager

Partager