我有以下html
<div class="options">
<div class="container">
<div class="swatch-option selected"></div>
<div class="info">Text</div>
</div>
<div class="container">
<div class="swatch-option"></div>
<div class="info">Text2</div>
</div>
</div>
我嘗試將 jquery 移動到關閉 div 類“options”末尾的“info”類，該類具有上一個類“swatch-option selected”
所以我的最終 html 應該是
<div class="options">
<div class="container">
<div class="swatch-option selected"></div>
</div>
<div class="container">
<div class="swatch-option"></div>
<div class="info">Text2</div>
</div>
<div class="info">Text</div>
</div>
我嘗試的 jquery 如下，但它不會移動info具有上一個類的類swatch-option selected
<script>
require([
'jquery'
], function ($) {
$(document).ready(function(){
$('.selected.info').appendTo('.options');
})
})
</script>
uj5u.com熱心網友回復：
$('.selected.info')表示搜索同時具有selected和info類但在您的示例中它們是兄弟的元素。
您可以使用相鄰兄弟選擇器 ( )
$(document).ready(function() {
$('.selected .info').appendTo('.options');
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="options">
<div class="container">
<div class="swatch-option selected"></div>
<div class="info">Text</div>
</div>
<div class="container">
<div class="swatch-option"></div>
<div class="info">Text2</div>
</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/424597.html
標籤：javascript html jQuery css