使用JavaScript获取DIV的内容
Get content of a DIV using JavaScript
我有两个div,称为DIV1和DIV2, DIV1由动态内容组成,DIV2为空。我需要DIV1的内容显示在DIV2。我该怎么做呢?
我以以下方式编码,这是不工作的。谁来纠正一下。
<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>
(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>
您需要将Div2设置为Div1的innerHTML。此外,JavaScript是区分大小写的-在你的HTML中,id Div2
是DIV2
。此外,您应该使用document
,而不是Document
:
var MyDiv1 = document.getElementById('DIV1');
var MyDiv2 = document.getElementById('DIV2');
MyDiv2.innerHTML = MyDiv1.innerHTML;
这是一个JSFiddle: http://jsfiddle.net/gFN6r/.
现在你将innerHTML设置为一个完整的div元素;你想把它设置为innerHTML。另外,我认为你需要MyDiv2。innerHTML = MyDiv 1 .innerHTML。此外,我认为document.getElementById
的参数是区分大小写的。当你想要DIV2
的时候,你却错过了Div2
var MyDiv1 = Document.getElementById('DIV1');
var MyDiv2 = Document.getElementById('DIV2');
MyDiv2.innerHTML = MyDiv1.innerHTML;
同样,这段代码将在DOM准备好之前运行。你可以像paislee说的那样把这个脚本放在body的底部,或者放在body的onload函数
中<body onload="loadFunction()">
然后
function loadFunction(){
var MyDiv1 = Document.getElementById('DIV1');
var MyDiv2 = Document.getElementById('DIV2');
MyDiv2.innerHTML = MyDiv1.innerHTML;
}
您可以简单地使用jquery插件来获取/设置div的内容。
vardivContent = $('#'DIV1).html();$ (' # ' DIV2) . html (divContent);
你需要包含jquery库
function 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;
}
- 使用JavaScript动态插入DIV的成本有多高
- 绝对定位不适用于Javascript DIV
- 当DIV中的文本高亮显示时,如何获得DIV中Span的值?(Javascript)
- 用于Dynamic Div'的Javascript数学函数;s风格
- DIV怎么能像Javascript中的另一个元素一样工作呢
- 多个DIV上的Javascript
- Javascript关键字搜索子类Div值
- JavaScript on点击更新Div
- 更改CSS以允许使用Javascript控制DIV位置
- 如何使用Javascript替换和隐藏Div内容
- 从Div创建图像,并使用Javascript和ASP.net将其保存到服务器
- Trouble overlaying one div with another with JavaScript &
- JavaScript/jQuery:显示DIV,直到用户停止在Textbox中键入
- 当Div可见时使用Javascript
- DIV - JavaScript 中的相对鼠标坐标
- 默认加载DIV Javascript
- 在DIV Javascript中添加AutoScroll
- 在单元格悬停时显示/隐藏DIV(javascript)
- 从DIV JavaScript中的几个元素更改ID和NAME
- Toggle Div Javascript