更改其ID后,将元素移动到另一个父级

hom*_*rrr 18 html javascript jquery

我有这样的HTML:

<span class="file-wrapper" id="fileSpan">
    <input type="file" name="photo[]" id="photo" />
    <span class="button">Click to choose photo</span>
</span>
Run Code Online (Sandbox Code Playgroud)

我想从那里提取输入字段,更改其ID并将其放在另一个div中.

我怎样才能做到这一点?如果需要jQuery就可以了,但是如果没有jQuery就可以了.

And*_*y E 31

它在jQuery中肯定很容易:

// jQuery 1.6+
$("#photo").prop("id", "newId").appendTo("#someOtherDiv");

// jQuery (all versions)
$("#photo").attr("id", "newId").appendTo("#someOtherDiv");
Run Code Online (Sandbox Code Playgroud)

工作演示:http://jsfiddle.net/AndyE/a93Az/


如果你想在普通的'JS'中做到这一点,它仍然相当简单:

var photo = document.getElementById("photo");
photo.id  = "newId";
document.getElementById("someOtherDiv").appendChild(photo); 
Run Code Online (Sandbox Code Playgroud)

工作演示:http://jsfiddle.net/AndyE/a93Az/1/

  • 值得解释的是,当你将`appendChild`(或`append`或`appendTo`)与现有DOM元素一起使用时,该元素将被移动到新位置,而不是复制到那里. (15认同)