Aşağıdaki JavaScript kodu, item-avatar-meta HTML öğesini item-stats sınıfı olan bir HTML öğesine taşır:
javascript
$(document).ready(function(){
var elem = $(".item-avatar-meta").detach();
$(".item-stats").append(elem);
});
Yukarıdaki kod, $(document).ready fonksiyonu ile sayfa yüklendiğinde çalışacak işlevi belirtir. İşlevin içinde, item-avatar-meta sınıfına sahip HTML öğesi .detach() fonksiyonu ile sayfadan kaldırılır ve bir değişkene atanır. Daha sonra, item-stats sınıfına sahip HTML öğesi .append() fonksiyonu ile kaldırılan öğe sonuna eklenir.
Bu işlevi sayfanızda jQuery kütüphanesi yüklendikten sonra bir <script> etiketi içinde kullanabilirsiniz. Örneğin:
html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Örnek Sayfa</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script><script>
$(document).ready(function(){
var elem = $(".item-avatar-meta").detach();
$(".item-stats").append(elem);
});
</script>
</head>
<body>
<div class="item">
<div class="item-stats">Soru İstatistikleri</div>
<div class="item-avatar-meta">Avatar ve Meta Verileri</div>
</div>
</body>
</html>
Yukarıdaki örnek kod, item-stats ve item-avatar-meta sınıflarına sahip iki HTML öğesi içerir. JavaScript kodu, item-avatar-meta sınıfına sahip olan öğeyi item-stats sınıfına sahip olan öğenin sonuna ekler. Bu şekilde, öğelerin sırası değişmiş olur.