js如何获得子元素的内容?

natici 2010-01-06 04:50:22

<div class="1">
<div class="1-1">
第一层
</div>
<div class="1-2">第二层</div>
<div class="1-3"><input type="button" id="确定"></div>
</div>
<div class="2">
<div class="2-1"></div>
<div class="2-2"></div>
</div>


如何在点击确定按钮后分别把层1-1,1-2的内容添加到2-1和2-2中?
...全文
917 7 打赏 收藏 转发到动态 举报
写回复
用AI写文章
7 条回复
切换为时间正序
请发表友善的回复…
发表回复
读易的庄稼人 2010-01-07
  • 打赏
  • 举报
回复
[Quote=引用 1 楼 wohaishiliumang 的回复:]
document.getElementById("2-1").innerHTML = document.getElementById("1-1").innerHTML;
记得改id
[/Quote]
这种方法不可取:原因
(1) 在页面加载时改变了页面的结构. 在IE6中如果网络变慢或者页面内容太大就会出现"终止操作"的错误. 也就是说"永远不要在页面加载时改变页面的Dom模型".

(2) 使用修改HTML内容添加元素, 不符合Dom标准. 在实际工作中也碰到过使用这种方法修改内容后, 某些浏览器中并不能立刻显示添加的元素, 因为不同浏览器的显示引擎是不同的.
wohaishiliumang 2010-01-06
  • 打赏
  • 举报
回复

<div class="1">
<div class="1-1">
第一层
</div>
<div class="1-2">第二层</div>
<div class="1-3"><input type="button" onclick="_click(this)" id="确定"></div>
</div>
<div class="2">
<div class="2-1">
第一层
</div>
<div class="2-2">第二层</div>
<div class="2-3"><input type="button" onclick="_click(this)" id="确定"></div>
</div>
<div class="3">
<div class="3-1"></div>
<div class="3-2"></div>
</div>
<div class="4">
<div class="4-1"></div>
<div class="4-2"></div>
</div>
<script>
function _click(_this)
{
var _p = _this.parentNode.parentNode;
var _divs = document.getElementsByTagName("div");
if(!!!_this._copy)
{
_this._copy=function(className){
for(var i=0,d=null;d=_divs[i];i++)
{
if(d.className == className)
{
for(var j=0,cd=null;cd=d.childNodes[j];j++)
{
cd.innerHTML = _p.childNodes[j].innerHTML;
}
break;
}
}
}
}
var className = _p.className;
switch(_p.className)
{
case "1":className = "3";break;
case "2":className = "4";break;
}
_this._copy(className);
}
</script>
hehuan1213 2010-01-06
  • 打赏
  • 举报
回复
$('input[type=button]').each(function () {
$(this).bind('click', function () {
var parentClass = $(this).parents('div:last')[0].getAttribute('class');
$('.' + parentClass + '-1').appendTo('.' + (parseInt(parentClass) + 2) + '-1');
});
});
xmliy 2010-01-06
  • 打赏
  • 举报
回复
用jQuery


$('input[type=button]').each(function () {
$(this).bind('click', function () {
var parentClass = $(this).parents('div:last')[0].getAttribute('class');
$('.' + parentClass + '-1').appendTo('.' + (parseInt(parentClass) + 2) + '-1');
});
});
antony1029 2010-01-06
  • 打赏
  • 举报
回复
顶!!
natici 2010-01-06
  • 打赏
  • 举报
回复

<div class="1">
<div class="1-1">
第一层
</div>
<div class="1-2">第二层</div>
<div class="1-3"><input type="button" id="确定"></div>
</div>
<div class="2">
<div class="2-1">
第一层
</div>
<div class="2-2">第二层</div>
<div class="2-3"><input type="button" id="确定"></div>
</div>
<div class="3">
<div class="3-1"></div>
<div class="3-2"></div>
</div>
<div class="4">
<div class="4-1"></div>
<div class="4-2"></div>
</div>


哦,我的问题没表达清楚,应该是在点击确定时判断点击哪个判断。如果点击的是div1里的确定,就把1-1,1-2分别添加到3-1和3-2中,如果点击的是div2里的确定,就把3-1,3-2分别添加到4-1,4-2中。如此类推。。。
wohaishiliumang 2010-01-06
  • 打赏
  • 举报
回复
document.getElementById("2-1").innerHTML = document.getElementById("1-1").innerHTML;
记得改id

87,904

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧