Rumah > hujung hadapan web > tutorial js > Bagaimana untuk mengalih keluar kandungan elemen dengan jquery

Bagaimana untuk mengalih keluar kandungan elemen dengan jquery

WBOY
Lepaskan: 2021-11-24 15:28:34
asal
2510 orang telah melayarinya

Kaedah: 1. Gunakan kaedah children() dan remove() untuk memadam kandungan elemen yang ditentukan Sintaksnya ialah "$(element).children().remove();" 2. Gunakan kaedah empty() Padamkan kandungan elemen yang ditentukan, sintaksnya ialah "$(element).empty();".

Bagaimana untuk mengalih keluar kandungan elemen dengan jquery

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 1.10.0, komputer Dell G3.

Cara mengalih keluar kandungan elemen dalam jquery

Dalam jquery, anda boleh menetapkan atribut id untuk sebahagian daripada teg kandungan dalam teg, dan dapatkan bahagian melalui objek Kandungan id.

Jika anda perlu memadamkan elemen dan kandungan, anda secara amnya boleh menggunakan dua kaedah jQuery berikut:

  • buang() - padamkan elemen yang dipilih (dan sub-nya elemen)

  • empty() - Padamkan elemen anak daripada elemen yang dipilih

Mari kita lihat penggunaan kedua-dua kaedah ini melalui contoh . elemen kanak-kanaknya.

Hasil keluaran:

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").children().remove();
  });
});
</script>
</head>

<body>

<div id="div1" style="height:120px;width:300px;border:1px solid black;background-color:yellow;">
<p>This is some text in the div.</p>
<p>This is a paragraph in the div.</p>
<p>This is another paragraph in the div.</p>
</div>

<br>
<button>删除 div 元素</button>

</body>
</html>
Salin selepas log masuk


Kaedah jQuery empty() memadamkan elemen anak bagi elemen yang dipilih. Bagaimana untuk mengalih keluar kandungan elemen dengan jquery

Hasil keluaran:

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").empty();
  });
});
</script>
</head>
<body>
<div id="div1" style="height:100px;width:300px;border:1px solid black;background-color:yellow;">
This is some text in the div.
<p>This is a paragraph in the div.</p>
<p>This is another paragraph in the div.</p>
</div>
<br>
<button>清空 div 元素</button>
</body>
</html>
Salin selepas log masuk


Tutorial video berkaitan yang disyorkan: Bagaimana untuk mengalih keluar kandungan elemen dengan jquerytutorial video jQuery

Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar kandungan elemen dengan jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan