我需要以编程方式更改 div 父级。例如<body> <div id="div_a"> <div id="child"></div> </div> <div id="div_b"> </div></body>我想知道是否可以将 id="child" parent 的 div 更改为 id="div_b" 的 div？我有搜索，但离得很近。但如果有类似的问题，请告诉我。
4 回答
LEATH
TA贡献1936条经验 获得超6个赞
您可以简单地使用appendChild节点并将其作为参数传递。一个节点不能同时在两个地方，所以它将把它移动到正确的位置。
let child = document.querySelector("#child");
let parent = document.querySelector("#div_b");
parent.appendChild(child);
<div id="div_a">
<div id="child"></div>
</div>
<div id="div_b">
</div>
精慕HU
TA贡献1845条经验 获得超8个赞
您需要将元素添加到新父级，然后将其从旧父级中删除。如果你可以使用 JQuery，你可以很容易地做到这一点
jQuery("#child").detach().appendTo('#div_b')
使用 JavaScript
var tmp = document.getElementById('child');
document.getElementById('div_b').appendChild(tmp.cloneNode(true));
tmp.remove();
慕容森
TA贡献1853条经验 获得超18个赞
在纯 JS 中，您可以使用document.querySelector(或document.getElementById)将 divNode.appendChild附加#child到#div_bdiv。由于一个节点不能存在于多个地方，这也会自动将其从以下位置删除#div_a：
document.querySelector('#div_b').appendChild(document.querySelector('#child'));
// or document.getElementById('div_b').appendChild(document.getElementById('child'));
<body>
<div id="div_a">
Div A!
<div id="child">I am a child of Div A</div>
</div>
<hr/>
<div id="div_b">
Div B!
</div>
</body>
噜噜哒
TA贡献1784条经验 获得超7个赞
根据您的应用程序，您可能希望使用 querySelector 或 querySelectorAll 来获取 id="child" 的 div。然后使用 [insert element var].classlist() 你可以 .remove('child') 然后 .add('div_b')。
添加回答
举报
0/150
提交
取消