Move Element - rasgane

Get Started > Details

• Details
• Install

Deskripsi.

function ini kurang lebih sama dengan appendChild yang memindahkan Element ke Element yang dituju, dengan penerapan yang lebih sederhana lagi.

Tidak menggunakan moveElement.

<div class="target_data"></div>
<div class="data">Isi Data</div>

let data = document.querySelector(".data");
let target_data = document.querySelector(".target_data");
data ? target_data.appendChild(data) : target_data.innerHTML = `<span>Tidak Ada data.</span>`;

Dan hasilnya akan seperti ini

<div class="target_data">
  <div class="data">Isi Data</div>
</div>

Menggunakan moveElement

<div class="target_data"></div>
<div class="data">Isi Data</div>

moveElement('.data', '.target_data', '<span>Tidak Ada data.</span>');

Dan hasilnya akan seperti ini

<div class="target_data">
  <div class="data">Isi Data</div>
</div>

Cara meng-install.

• Letakkan javascript ini di atas </head>

  function moveElement(e,n,t){let o=document.querySelector(e),c=document.querySelector(n);c&&(o?c.appendChild(o):c.innerHTML=t)}function moveElement2(e,n){let t=document.querySelector(e),o=document.querySelector(n);o&&(t?o.appendChild(t):o.remove())}

• Dan kode siap digunakan.

Dalam kode moveElement ada 2 fungsi yang sudah tambahkan, moveElement dan moveElement2

moveElement

Untuk kode ini memindahkan element ke element yang dituju dengan tambahan jika data element yang ingin dipindah tidak ada maka akan diganti dengan text atau tag HTML yang sudah ditentukan.

Fungsi.

moveElement('Data_Elemen', 'Tujuan_Elemen', 'Text/Tag HTML');

Name	Deskripsi
Data_Elemen	isi dengan data element yang ingin dipindah, seperti tag HTML, id atau class.
Tujuan_Elemen	isi dengan tujuan element yang ingin dipindah, seperti tag HTML, id atau class.
Text/Tag HTML	Isi dengan Text/Tag HTML untuk pengganti jika Data_Elemen tidak ada.

Contoh:

<div class="target_data"></div>
<div class="data">Isi Data</div>

moveElement('.data', '.target_data', '<span>Tidak Ada data.</span>');

Dan hasilnya akan seperti ini

<div class="target_data">
  <div class="data">Isi Data</div>
</div>

moveElement2

Untuk kode ini memindahkan element ke element yang dituju saja.

Fungsi.

moveElement2('Data_Elemen', 'Tujuan_Elemen');

Name	Deskripsi
Data_Elemen	isi dengan data element yang ingin dipindah, seperti tag HTML, id atau class.
Tujuan_Elemen	isi dengan tujuan element yang ingin dipindah, seperti tag HTML, id atau class.

Contoh:

<div class="target_data"></div>
<div class="data">Isi Data</div>

moveElement2('.data', '.target_data');

Dan hasilnya akan seperti ini

<div class="target_data">
  <div class="data">Isi Data</div>
</div>