DOM - m
/Html JavaSript/DOM - m.a.j text html.html
<script>
// --------------------------------------------------------------------------
// Version SIMPLE (si pas de html à ajouter) :
// --------------------------------------------------------------------------
function SetTxt(idNode, txt){
document.getElementById(idNode).childNodes[0].nodeValue=txt;
}
function CopyTo(idFrom, idNode){
document.getElementById(idNode).childNodes[0].nodeValue=document.getElementById(idFrom).value;
}
// --------------------------------------------------------------------------
// Version Complette (ajout de <br> en fin de ligne) :
// --------------------------------------------------------------------------
function copyTextarea2div(idTextareaSource, idDivDest) {
// copy textarea content to a div
var lignes = document.getElementById(idTextareaSource).value.split('\n');
var ll, child, div = document.getElementById(idDivDest)
while (child = div.firstChild) div.removeChild(child);
if (lignes.length==1 && lignes[0]=='') return;
for (ll in lignes) {
var txt = document.createTextNode(lignes[ll]);
div.appendChild(txt);
var BR = document.createElement('br');
div.appendChild(BR);
}
}
function textarea2div(idTextarea) {
// replace textarea by a div with the same content
var textarea = document.getElementById(idTextarea);
var lignes = textarea.value.split('\n');
if (lignes.length==1 && lignes[0]=='') return;
var ll, div = document.createElement("div");
for(ll in lignes) {
var txt = document.createTextNode(lignes[ll]);
div.appendChild(txt);
var BR = document.createElement('br');
div.appendChild(BR);
}
textarea.parentNode.replaceChild(div, textarea);
}
</script>
<textarea id="TxtFOO" cols="30" rows="5">
de ce textarea vers un div plus bas
ligne 1
ligne 2
ligne 3
</textarea>
<input type="button" value="maj" onClick="copyTextarea2div('TxtFOO', 'divFOO')">
<br>
<textarea id="TxtFOOhimself" cols="30" rows="5">
Remplace ce textarea par un div
ligne 1
ligne 2
ligne 3
</textarea>
<input type="button" value="maj" onClick="textarea2div('TxtFOOhimself')">
<div id="divFOO">
ici le div à maj
</div>