我有來自瀏覽器控制臺的這段代碼，它來自資料表插件的 Javascript（所有代碼都被縮短）：
<div class="dataTables_length" id="mytable_length">
<label>
"??? "
<select name="mytable_length" aria-controls="mytable" class="form-select form-select-sm"></select>
"?????"
</label>
</div>
在這段代碼下面我有這段代碼（所有代碼都被縮短了）：
<div id="mytable_filter" class="dataTables_filter">
<label>
"???: "
<input type="search" class="form-control form-control-sm" placeholder="" aria-controls="mytable">
</label>
</div>
這是從瀏覽器控制臺拍攝的照片，只是為了說明問題 https://i.stack.imgur.com/UeLz9.png
現在我需要洗掉父標簽<div id="mytable_filter" >
并使用元素獲取/移動子標簽，label然后使用 jQueryinput將它們添加到/下方<div id="mytable_length">。所以最終的代碼將是：
<div class="dataTables_length" id="mytable_length">
<label>
"??? "
<select name="mytable_length" aria-controls="mytable" class="form-select form-select-sm"></select>
"?????"
</label>
<label>
"???: "
<input type="search" class="form-control form-control-sm" placeholder="" aria-controls="mytable">
</label>
</div>
使用 jQuery，到目前為止我所做的是：
$(document).ready(function(){
$('#mytable').DataTable({
initComplete: function () {
$('.dataTables_filter').remove();
},
});
});
但這只會洗掉<div id="mytable_filter" >它的子標簽，這不是我需要的。我怎樣才能做到這一點？
uj5u.com熱心網友回復：
我需要洗掉父標簽
<div id="mytable_filter" >并使用元素標簽和輸入獲取/移動子標簽并將它們添加到/下方<div id="mytable_length">
將節點附加到給定容器是 jQuery 中的基本操作。選擇節點，使用.appendTo()，完成。
$(function () {
$('#mytable').DataTable({
initComplete: function () {
$('.dataTables_filter').children().appendTo('#mytable_length');
$('.dataTables_filter').remove();
},
});
});
一個 DOM 節點只能有一個父節點。如果您將其附加到不同的父級，它將有效地從其當前父級中洗掉。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/405731.html
標籤：