使用 JavaScript 获取 DIV 的内容
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8647216/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get content of a DIV using JavaScript
提问by lock
I have two DIV's called DIV1 and DIV2 and DIV1 consists of dynamic content and DIV2 is empty. I need content of DIV1 to be displayed in DIV2. How can I do it.
我有两个名为 DIV1 和 DIV2 的 DIV，DIV1 由动态内容组成，而 DIV2 为空。我需要在 DIV2 中显示 DIV1 的内容。我该怎么做。
I coded in below manner which is not working. Anybody please correct it.
我以下面的方式编码，这是行不通的。任何人请纠正它。
<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>
回答by paislee
(1) Your <script>tag should be placed before the closing </body>tag. Your JavaScript is trying to manipulate HTML elements that haven't been loaded into the DOM yet.
(2) Your assignment of HTML content looks jumbled.
(3) Be consistent with the case in your element ID, i.e. 'DIV2' vs 'Div2'
(4) User lower case for 'document' object (credit: ThatOtherPerson)
(1) 你的<script>标签应该放在结束</body>标签之前。您的 JavaScript 正在尝试操作尚未加载到 DOM 中的 HTML 元素。
(2) 您对 HTML 内容的分配看起来很混乱。
(3) 与元素 ID 中的大小写一致，即 'DIV2' 与 'Div2'
(4) 'document' 对象的用户小写（来源：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>
回答by Adam Rackis
Right now you're setting the innerHTML to an entire div element; you want to set it to just the innerHTML. Also, I think you want MyDiv2.innerHTML = MyDiv 1.innerHTML. Also, I think the argument to document.getElementByIdis case sensitive. You were passing Div2when you wanted DIV2
现在，您正在将 innerHTML 设置为整个 div 元素；您想将其设置为仅innerHTML。另外，我认为您想要 MyDiv2.innerHTML = MyDiv 1.innerHTML。另外，我认为 to 的论点document.getElementById区分大小写。你Div2在你想要的时候路过DIV2
var MyDiv1 = Document.getElementById('DIV1');
var MyDiv2 = Document.getElementById('DIV2');
MyDiv2.innerHTML = MyDiv1.innerHTML;
Also, this code will run before your DOM is ready. You can either put this script at the bottom of your body like paislee said, or put it in your body's onload function
此外，此代码将在您的 DOM 准备就绪之前运行。你可以像 paislee 说的那样把这个脚本放在你身体的底部，或者把它放在你身体的 onload 函数中
<body onload="loadFunction()">
and then
进而
function loadFunction(){
var MyDiv1 = Document.getElementById('DIV1');
var MyDiv2 = Document.getElementById('DIV2');
MyDiv2.innerHTML = MyDiv1.innerHTML;
}
回答by ThatOtherPerson
You need to set Div2 to Div1's innerHTML. Also, JavaScript is case sensitive - in your HTML, the id Div2is DIV2. Also, you should use document, not Document:
您需要将 Div2 设置为 Div1 的 innerHTML。此外，JavaScript 区分大小写 - 在您的 HTML 中，idDiv2是DIV2. 此外，您应该使用document，而不是Document：
var MyDiv1 = document.getElementById('DIV1');
var MyDiv2 = document.getElementById('DIV2');
MyDiv2.innerHTML = MyDiv1.innerHTML;
Here is a JSFiddle: http://jsfiddle.net/gFN6r/.
这是一个 JSFiddle：http: //jsfiddle.net/gFN6r/。
回答by sarath kumar
function add_more() {
函数 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;
}
回答by sethupathi.t
simply you can use jquery plugin to get/set the content of the div.
简单地你可以使用 jquery 插件来获取/设置 div 的内容。
var divContent = $('#'DIV1).html(); $('#'DIV2).html(divContent );
var divContent = $('#'DIV1).html(); $('#'DIV2).html(divContent);
for this you need to include jquery library.
为此，您需要包含 jquery 库。
