Question

插入现有元素和刚创建的元素

2011-08-18

1174

javascript dom

如果我有： <span>Some Code Here</span> ，我可以创建一个新的 div 元素并将 span 元素移动到刚创建的 div 内吗？

新元素必须位于 span 元素之前所在的相同位置

我想使用纯 javascript 代码

Answer 1

HTML：

<span id="the_id">Some code...</span>

JS：

var the_div = document.getElementById('the_id');
var foobar = document.createElement('div');
foobar.appendChild(the_id);
the_id.parentNode.replaceChild(foobar, the_id);

Answer 2

var wrapper = document.createElement('div');
var selected_span = document.getElementByTagName('span')[0]; //get the first available span element
span_clone = selected_span.cloneNode(true);
selected_span.parentNode.insertBefore(wrapper, selected_span);
selected_span.parentNode.removeChild(selected_span);
wrapper.appendChild(span_clone);

此代码的作用是创建一个新的 <div> ，创建 span 的副本，删除原始 span ，然后将副本插入 div 内。>

jsFiddle

这是容器内的相同示例。

Answer 3

点击此处：

http://jsbin.com/uyiluf/3

来源：

http://jsbin.com/uyiluf/3/edit#source

Alex

2011-08-18