#JQuery - #JQuery Dasar

Belajar JQuery Part 10 : Menghapus Element Dengan JQuery

Menghapus Element Dengan JQuery

Setelah ada tutorial sebelumnya di www.malasngoding.com anda mempelajari tentang cara menambah element dengan JQuery, menetapkan nilai dan value pada element HTML, serta belajar cara mendapatkan nilai dan value pada element HTML dengan menggunakan JQuery. maka pada tutorial belajar JQuery Part 10 ini akan di jelaskan tentang cara menghapus element HTML dengan JQuery.

Belajar JQuery Part 10 : Menghapus Element Dengan JQuery

Untuk menghapus element HTML dengan JQuery, JQuery telah menyediakan sebuah fungsi yang berguna untuk menghapus element HTML yaitu bisa menggunakan fungsi remove(). fungsi remove() pada JQuery adalah sebuah fungsi yang di sediakan oleh JQuery untuk menghapus element HTML untuk keperluan sesuatu. untuk lebih jelasnya dan menambah pemahaman dari fungsi remove untuk menghapus element HTML dengan JQuery silahkan perhatikan contoh cara menggunakan fungsi remove() pada jquery berikut ini.

index.html

<!DOCTYPE html>

<html>

<head>

<title>Tutorial belajar JQuery Part 10 : Menghapus Element dengan JQuery</title>

</head>

<body>

<h1>remove Function JQuery | www.malasngoding.com</h1>

<button class="tombol">Tombol</button>

<span>INI ADALAH KOTAK</span>

</div>

</body>

$(document).ready(function(){

$('.tombol').click(function(){

$('.kotak').remove();

});

</script>

</html>

style.css

body{

font-family: sans-serif;

}

h1{

text-align: center;

}

.kotak{

width: 300px;

height: auto;

background: orange;

padding: 30px;

color: #fff;

margin-bottom: 20px;

}

.tombol{

color: #fff;

background: #232323;

border: none;

padding: 10px;

}

menghapus element dengan jquery

See the Pen adpaVa by Malas Ngoding (@malasngoding) on CodePen.0

pada contoh di atas bisa di perhatikan bahwa fungsi remove() di gunakan untuk menghapus element html. Menghapus Element Dengan JQuery

$('.tombol').click(function(){

$('.kotak').remove();

});

pada saat tombol di klik maka fungsi remove() di jalankan pada element html yang memiliki class kotak untuk menghapus element kotak. sekian tutorial cara Menghapus Element Dengan JQuery serta contoh penggunaannya. pada tutorial selanjutnya tentang jquery akan di bahas tentang cara menambah class pada elemet html dan cara menghapus class pada element html dengan menggunakan bantuan JQuery.

Diki Alfarabi Hadi

Coding enthusiast. Someone who love learn something new. especially about web programming and web design. happy to share about knowledge and learn from other.