Bagaimana untuk memadam teks dalam JavaScript

<p>Dengan perkembangan teknologi Internet yang berterusan, JavaScript telah menjadi salah satu bahasa teras​​untuk lebih banyak laman web dan aplikasi. Dalam proses pembangunan web, selalunya perlu menambah, memadam, mengubah suai dan menyemak elemen pada halaman. Artikel ini akan memberi tumpuan kepada cara mengalih keluar teks menggunakan JavaScript.

1. Padamkan nod teks

<p>Memadamkan nod teks ialah salah satu cara paling asas untuk memadamkan teks dalam JavaScript. Nod teks merujuk kepada kandungan teks biasa dalam elemen HTML yang tidak mengandungi sebarang teg. Contohnya, "Hello World" dalam kod HTML berikut ialah nod teks:

<p>Hello World</p>

<p>Kod untuk memadamkan nod teks menggunakan JavaScript adalah seperti berikut:

var node = document.getElementsByTagName("p")[0];
node.removeChild(node.firstChild);

<p>Kod ini mula-mula memperoleh halaman Elemen teg <p> pertama dalam elemen, dan kemudian padamkan nod anak pertama elemen, iaitu, nod teks "Hello World". Perlu diingatkan bahawa jika terdapat berbilang nod teks dalam elemen, semuanya boleh dipadamkan dengan menggelung.

2. Padam elemen HTML

<p>Jika anda ingin memadamkan elemen HTML itu sendiri yang mengandungi nod teks, anda perlu menggunakan kaedah JavaScript lain - padam elemen HTML. Contohnya, tag <p> dan nod teks yang terkandung dalam kod HTML berikut akan dipadamkan bersama:

<div>
  <p>Hello World</p>

Salin selepas log masuk

<p>Kod JavaScript untuk memadam elemen HTML adalah seperti berikut:

var node = document.getElementsByTagName("div")[0];
var childNode = node.getElementsByTagName("p")[0];
node.removeChild(childNode);

<p>Ini Kod mula-mula mendapat elemen teg <div>, kemudian mendapat elemen teg <p> pertama dalam elemen itu, dan akhirnya memadamkannya. Begitu juga, jika terdapat berbilang nod teks dan sub-elemen dalam elemen HTML, anda boleh memadamkan kesemuanya dengan menggelungkannya.

3. Padamkan kandungan kotak input

<p>Selain memadamkan teks statik dalam halaman, JavaScript juga boleh digunakan untuk memadamkan kandungan kotak input. Contohnya, kotak input dalam kod HTML berikut:

<input type="text" id="input-box">

<p> Untuk memadam kandungan dalam kotak input ini, anda boleh menggunakan kod JavaScript berikut:

var inputBox = document.getElementById("input-box");
inputBox.value = "";

<p>Kod ini dahulu mendapat elemen kotak input, dan kemudian tetapkan atribut nilainya kepada rentetan kosong, iaitu, padam kandungan dalam kotak input.

4. Mengalih keluar pilihan senarai lungsur turun

<p>Jika tapak web atau aplikasi memerlukan senarai lungsur untuk memilih pilihan, kadangkala perlu menambah atau mengalih keluar pilihan secara dinamik. Untuk mengalih keluar pilihan daripada senarai juntai bawah, anda boleh menggunakan kod JavaScript berikut:

var selectBox = document.getElementById("select-box");
selectBox.removeChild(selectBox.options[index]);

<p>Kod ini mula-mula mendapatkan elemen senarai juntai bawah, dan kemudian memanggil kaedah removeChild() untuk memadam pilihan pada kedudukan yang ditetapkan. Antaranya, parameter indeks menentukan nilai indeks pilihan yang akan dipadamkan. Sebagai contoh, jika anda ingin mengalih keluar pilihan kedua, anda boleh menetapkan indeks kepada 1.

<p>Ringkasan

<p>Artikel ini memperkenalkan kaedah JavaScript untuk memadamkan nod teks, elemen HTML, kandungan kotak input dan pilihan senarai lungsur. Operasi ini sering digunakan dalam proses pembangunan web Menguasai teknik ini boleh menjadikan kod berfungsi lebih cekap dan fleksibel. Sudah tentu, anda perlu menyemak dengan teliti kod yang berkaitan sebelum operasi untuk mengelakkan pemadaman kandungan lain secara tidak sengaja dan menyebabkan masalah yang tidak perlu. Pastikan anda menguji sepenuhnya kefungsian kod anda untuk memastikan ia berfungsi dengan betul.

Atas ialah kandungan terperinci Bagaimana untuk memadam teks dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!