2

我正在尝试将带有 class="SomeDiv" 的 div 移动到 ID="ParentDiv" 的 div 中/在其中

如果我编辑 javascript 以将具有 ID 的 div 移动到另一个具有有效差异 ID 的 div 中。但是将具有 Class 的 div 移动到具有 ID 的 div 中是行不通的。我错过了什么吗？

HTML 

<div id="ParentDiv">
    <div id="ChildDiv">
        <ul>
            <li>1</li>
            <li>2</li>
        </ul>
    </div>
    <!-- move SomeDiv here -->
</div>
<div class="SomeDiv">some content</div>

JS：

document.getElementById('ParentDiv').appendChild(document.getElementsByClassName('SomeDiv'));

http://jsfiddle.net/9gvsa/1/

4

5 回答 5

5

.getElementsByClassName返回数组，因此您需要在末尾有一个索引，如下所示： 

document.getElementById('ParentDiv').appendChild(document.getElementsByClassName('SomeDiv')[0]);
于 2013-07-23T18:50:09.010 回答
3

使用 jquery 更容易，查看 jsfiddle 的更新版本，通过检查 dom 树，您可以看到项目已被移动

$(document).ready(function(){
$("#ParentDiv").append($(".SomeDiv"));
});

例子

于 2013-07-23T19:02:51.587 回答
1

改为使用document.getElementsByClassName('SomeDiv')[0] ，
getElementsByClassName返回元素数组，同时getElementsById返回单个元素

于 2013-07-23T18:50:31.860 回答
0

来源：document.getElementsByClassName

getElementsByClassName返回找到的元素的 HTMLCollection。

如果你知道你的 div 有一个独特的类，你可以做

document.getElementById('ParentDiv').appendChild(document.getElementsByClassName('SomeDiv')[0]);
于 2013-07-23T18:52:01.333 回答
0

你不能得到这样的类的元素。document.getElementsByClassName 返回一个数组。你将不得不做类似的事情......

document.getElementsByClassName('SomeDiv')[0]

此外，如果您想将该 className 的所有 div 放入 div 中，请进行一些迭代。

for (i=0;i<=document.getElementsByClassName('SomeDiv').length;i++) {
    document.getElementById('ParentDiv').appendChild(document.getElementsByClassName('SomeDiv')[i]);
}
于 2013-07-23T18:55:00.263 回答