Copier un élément existant

**Loceka** · 13/11/2005, 12h15

Bonjour,

Je voudrais copier le contenu d'un élément précis d'une page source vers un page cible.

Pour celà, j'ai tenté de récupérer le contenu du noeud par "nodeValue", mais apparement ça ne fonctionne que s'il n'y a pas d'autre balises dans l'élément...

Je sens que je ne suis pas clair, alors voici un exemple :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
Page source : 
<div ID="el1" onClick="ouvrirNouvellePage('el1')">
  <div class="contenu">
    <ul><li>Liste à copier</li></ul>
  </div>
</div>
 
<div ID="el2" ...>...</div>
 
Page cible :
<div class="contenu">
  <ul><li>Liste à copier</li></ul>
</div>

Je dois de plus pouvoir appliquer cette fonction à chacun des éléments (el1, el2, ...).

Je ne vois plus vraiment quoi essayer...
Si vous avez une idée, elle sera la bienvenue.

Merci, Loceka.

**siddh** · 13/11/2005, 13h45

salut,
alors visiblement, pour des raisons de securité, tu ne peux pas passer des objets complets (obtenus avec cloneNode(true)) mais le innerHTML passe.

page 1 :

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
30
31
32
<html>
	<head>
	<title>copie</title>
		<script type='text/javascript'>
			function copy(elemid){
				var win = window.open("fen2.html","fen2","width=500;height=500");
				win.document.getElementById("pasteHere").innerHTML = document.getElementById(elemid).innerHTML;
			}
		</script>
	</head>
	<body>
		<div id="div1">
			contenu du div 1 .... <br />
			<ul>
				<li>1</li>
				<li>2</li>
				<li>3</li>
			</ul>
		</div>
		<hr />
		<div id="div2">
			contenu du div 2 .... <br />
			<ul>
				<li>5</li>
				<li>6</li>
				<li>7</li>
			</ul>
		</div>
		<input type="button" value="copier div 1" onclick="copy('div1')" />
		<input type="button" value="copier div 2" onclick="copy('div2')" />
	</body>
</html>

page 2:

Code :

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

1
2
3
4
5
6
7
8
9
<html>
	<head>
	<title>fenetre 2</title>
	</head>
	<body>
		<div id='pasteHere'>
		</div>
	</body>
</html>

si tu veux cumuler, il suffit de faire un += au lieu du =

**javatwister** · 13/11/2005, 13h53

salut;

intéressant, mais IE va te poser problème;

tu peux créer un double du noeud via element.cloneNode(true), puis l'intégrer au dom du document ouvert :

Code :

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

document.getElementById("noeud").appendChild(element_cloné);

mais IE, conforme aux spéc, d'ailleurs, n'admet pas un append quand le neoud ne fait pas partie du même document;

il te reste innerHTML si tu tiens à copier un contenu html;

**Loceka** · 13/11/2005, 14h12

Merci beaucoup à tous les 2 !

La solution de siddh fonctionne à merveille et je n'ai pas encore testée l'autre, mais si elle n'est pas conforme au DOM, je crois que je vais l'oublier.