使用JavaScript獲取DIV的內容

我有兩個名爲DIV1和DIV2的DIV，DIV1由動態內容組成，DIV2是空的。我需要在DIV2中顯示DIV1的內容。我該怎麼做。使用JavaScript獲取DIV的內容

我用下面的方式編碼，這是行不通的。有人請糾正它。

<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>

來源

2011-12-27 lock

（1）您<script>標籤前應放置關閉</body>標記。您的JavaScript試圖操縱尚未加載到DOM中的HTML元素。
（2）您的HTML內容分配看起來很混亂。
（3）與所在元素ID的情況一致，即 'DIV2' VS 'Div2的'
（4）用戶下爲 '文檔' 對象的情況下（來源：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>

來源

2011-12-27 17:11:31 paislee

如果您使用的JavaScript框架之一，則順序並不重要。例如，您可以告訴JQuery等待使用$（document）.ready加載內容，Angular允許您使用promise來編寫代碼。將JS遍佈到一個文件中並不是一個好習慣，但將它放入瀏覽器加載的文件中意味着您必須等待。就我個人而言，我認爲在這裏和那裏特別是當你在開發時，JS的奇怪的一點是沒什麼大不了的。 – Ghoti 2013-06-18 15:23:00

非常感謝您指出＃1！ – LinusGeffarth 2017-07-30 17:17:54

現在，您正在將innerHTML設置爲整個div元素;你想把它設置爲innerHTML。另外，我認爲你想要MyDiv2.innerHTML = MyDiv .innerHTML。另外，我認爲document.getElementById的說法是區分大小寫的。你路過Div2當你想要DIV2

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

此外，該代碼將運行在你的DOM已準備就緒。您可以把這個腳本在你的身體的底部像paislee說，還是把它放在你身體的onload功能

<body onload="loadFunction()">

然後

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

來源

2011-12-27 17:10:00

您需要將Div2設置爲Div1的innerHTML。此外，JavaScript區分大小寫 - 在您的HTML中，編號爲Div2的是DIV2。此外，你應該使用document，不Document：

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

這裏是一個的jsfiddle：http://jsfiddle.net/gFN6r/。

來源

2011-12-27 17:14:26 ThatOtherPerson

只需你使用jquery插件來獲取/設置div的內容。

var divContent = $（'＃'DIV1）.html（）; $（'＃'DIV2）.html（divContent）;

爲此，您需要包含jquery庫。

來源

2011-12-27 17:27:05

這個問題不是關於jquery的。 – 2015-02-28 16:36:34

功能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; 

}

來源

2013-04-19 10:36:04

使用JavaScript獲取DIV的內容

回答

相關問題