Ottenere il contenuto di un DIV utilizzando JavaScript

Ho due DIV chiamati DIV1 e DIV2 e DIV1 è costituito da contenuto dinamico e DIV2 è vuoto. Ho bisogno che il contenuto di DIV1 sia visualizzato in DIV2. Come posso farlo.Ottenere il contenuto di un DIV utilizzando JavaScript

Ho codificato nel modo seguente che non funziona. Qualcuno, per favore, correggilo.

<script type="text/javascript"> 

    var MyDiv1 = Document.getElementById('DIV1'); 
    var MyDiv2 = Document.getElementById('Div2'); 
    MyDiv2.innerHTML = MyDiv2; 

</script> 
<body> 
<div id="DIV1"> 
// Some content goes here. 
</div> 

<div id="DIV2"> 
</div> 
</body>

fonte

2011-12-27 lock

(1) Il tuo tag <script> venga preposto il tag di chiusura </body>. Il tuo JavaScript sta provando a manipolare elementi HTML che non sono ancora stati caricati nel DOM.
(2) L'assegnazione di contenuto HTML sembra confusa.
(3) Essere coerente con il caso nella vostra ID elemento, vale a dire 'DIV2' vs
(4) minuscolo User 'Div2' per oggetto 'documento' (di credito: ThatOtherPerson)

<body> 
<div id="DIV1"> 
// Some content goes here. 
</div> 

<div id="DIV2"> 
</div> 
<script type="text/javascript"> 

    var MyDiv1 = document.getElementById('DIV1'); 
    var MyDiv2 = document.getElementById('DIV2'); 
    MyDiv2.innerHTML = MyDiv1.innerHTML; 

</script> 
</body>

fonte

2011-12-27 17:11:31 paislee

Se si utilizza uno dei framework JavaScript poi l'ordine non importa. Ad esempio, puoi dire a JQuery di aspettare fino a quando i contenuti sono caricati usando $ (document). Già, Angular ti permette di scrivere codice usando le promesse. Non è consigliabile spargere JS su un file, ma inserendolo nei file caricati dal browser significa che devi aspettare. Personalmente penso che lo strano pezzo di JS qua e là, in particolare quando stai sviluppando, non sia un grosso problema. – Ghoti

Grazie mille per aver segnalato # 1! – LinusGeffarth

In questo momento si imposta il innerHTML su un intero elemento div; vuoi impostarlo solo sul innerHTML. Inoltre, penso che tu voglia MyDiv2.innerHTML = MyDiv .innerHTML. Inoltre, penso che l'argomento di document.getElementById sia case sensitive. Si passavano Div2 quando si voleva DIV2

var MyDiv1 = Document.getElementById('DIV1'); 
var MyDiv2 = Document.getElementById('DIV2'); 
MyDiv2.innerHTML = MyDiv1.innerHTML;

Inoltre, questo codice verrà eseguito prima del DOM è pronto. È possibile mettere questo script alla parte inferiore del vostro corpo come Paislee detto, o metterlo in funzione onload del vostro corpo

<body onload="loadFunction()">

e poi

function loadFunction(){ 
    var MyDiv1 = Document.getElementById('DIV1'); 
    var MyDiv2 = Document.getElementById('DIV2'); 
    MyDiv2.innerHTML = MyDiv1.innerHTML; 
}

fonte

2011-12-27 17:10:00

È necessario per impostare Div2 in innerHTML di Div1. Inoltre, JavaScript è case sensitive: nel tuo codice HTML, l'ID Div2 è DIV2. Inoltre, si dovrebbe usare document, non Document:

var MyDiv1 = document.getElementById('DIV1'); 
var MyDiv2 = document.getElementById('DIV2'); 
MyDiv2.innerHTML = MyDiv1.innerHTML;

Ecco un JSFiddle: http://jsfiddle.net/gFN6r/.

fonte

2011-12-27 17:14:26 ThatOtherPerson

semplicemente è possibile utilizzare il plugin jquery per ottenere/impostare il contenuto del div.

var divContent = $ ('#' DIV1) .html(); $ ('#' DIV2) .html (divContent);

per questo è necessario includere libreria jquery.

fonte

2011-12-27 17:27:05

La domanda non riguardava la jquery. –

funzione add_more() {

var text_count = document.getElementById('text_count').value; 
var div_cmp = document.getElementById('div_cmp'); 
var values = div_cmp.innnerHTML; 
var count = parseInt(text_count); 
divContent = ''; 

for (i = 1; i <= count; i++) { 

    var cmp_text = document.getElementById('cmp_name_' + i).value; 
    var cmp_textarea = document.getElementById('cmp_remark_' + i).value; 
    divContent += '<div id="div_cmp_' + i + '">' + 
     '<input type="text" align="top" name="cmp_name[]" id="cmp_name_' + i + '" value="' + cmp_text + '" >' + 
     '<textarea rows="1" cols="20" name="cmp_remark[]" id="cmp_remark_' + i + '">' + cmp_textarea + '</textarea>' + 
     '</div>'; 
} 

var newCount = count + 1; 

if (document.getElementById('div_cmp_' + newCount) == null) { 
    var newText = '<div id="div_cmp_' + newCount + '">' + 
     '<input type="text" align="top" name="cmp_name[]" id="cmp_name_' + newCount + '" value="" >' + 
     '<textarea rows="1" cols="20" name="cmp_remark[]" id="cmp_remark_' + newCount + '" ></textarea>' + 
     '</div>'; 
    //content = div_cmp.innerHTML; 
    div_cmp.innerHTML = divContent + newText; 
} else { 
    document.getElementById('div_cmp_' + newCount).innerHTML = '<input type="text" align="top" name="cmp_name[]" id="cmp_name_' + newCount + '" value="" >' + 
     '<textarea rows="1" cols="20" name="cmp_remark[]" id="cmp_remark_' + newCount + '" ></textarea>'; 
} 

document.getElementById('text_count').value = newCount; 

}

fonte

2013-04-19 10:36:04

Ottenere il contenuto di un DIV utilizzando JavaScript

risposta

Problemi correlati