使用原型将一个 div 从一个 div 内部移动到另一个 div? [英] Moving a div from inside one div to another div using Prototype?

问题描述

在原型或普通但跨浏览器兼容的 Javascript 中，如何将 div 的内容移动到另一个 div 的内容?

div 内部是一个带有 id 和依赖 Javascript 代码的表单，带有事件观察器.我不希望这只是因为我在 DOM 中移动了一个块而中断.'this innerHTML = that innerHTML' 解决方案不是我正在寻找的.加载 DOM 时，我也需要这样做.

我想从这里开始:

<div id='MacGuffin'><p>Hello Worlds!</p>

<div id='那里'>

为此:

<div id='那里'><div id='MacGuffin'><p>Hello Worlds!</p>

...当文档加载时没有任何跳跃.

解决方案

您可以在 BODY 标签的最后添加:

MacGuffin 将自动从一个移动到另一个.
而且不会有任何闪烁.

In prototype or normal-but-cross-browser-compatible Javascript, how do I move the contents of a div to the contents of another div?

Inside the div is a form with ids and dependent Javascript code with event observers. I don't want this to break just because I have moved a block in the DOM. A 'this innerHTML = that innerHTML' solution is not what I am looking for. I will also be needing to do this when the DOM is loaded.

I want to go from this:

<div id='here'>
    <div id='MacGuffin'>
    <p>Hello Worlds!</p>
    </div>
</div>
<div id='there'>
</div>

to this:

<div id='here'>
</div>
<div id='there'>
    <div id='MacGuffin'>
    <p>Hello Worlds!</p>
    </div>
</div>

...when the document loads with nothing jumping about.

解决方案

You can add this at the very end of the BODY tag:

<script>
  document.getElementById('there').appendChild(
    document.getElementById('MacGuffin')
  );
</script>

MacGuffin will be moved automatically from one to the other.
And there won't be any flickering.

这篇关于使用原型将一个 div 从一个 div 内部移动到另一个 div?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！