Rumah  >  Artikel  >  hujung hadapan web  >  javascript pilih ubah suai

javascript pilih ubah suai

王林
王林asal
2023-05-17 15:43:38564semak imbas

JavaScript ialah bahasa pengaturcaraan yang digunakan secara meluas dalam pembangunan web Ia boleh mencapai kesan dinamik pada halaman web dengan memilih elemen DOM dan mengubah suainya. Artikel ini merangkumi pemilihan dan pengubahsuaian dalam JavaScript.

Pilih

JavaScript boleh memilih elemen DOM dengan cara berikut:

1 Pemilih nama teg

Gunakan pemilih nama teg untuk memilih semua elemen halaman web Elemen dengan nama tag ini. Contohnya, untuk memilih semua elemen p:

var pElements = document.getElementsByTagName("p");

2 Pemilih ID

Gunakan pemilih ID untuk memilih elemen dengan ID tertentu. Contohnya, untuk memilih elemen dengan ID "myDiv":

var myDiv = document.getElementById("myDiv");

3 pemilih kelas

Gunakan pemilih kelas untuk memilih elemen dengan nama kelas tertentu. Contohnya, pilih elemen dengan kelas "myClass":

var myElements = document.getElementsByClassName("myClass");

4. Pemilih atribut

Gunakan pemilih atribut untuk memilih elemen dengan atribut tertentu. Contohnya, untuk memilih semua elemen dengan atribut "jenis data":

var elementsWithType = document.querySelectorAll("[data-type]");

Ubah suai

Dengan kaedah elemen pilih, JavaScript juga boleh mengubah suai elemen yang dipilih.

1 Ubah suai kandungan teks elemen

Anda boleh menukar kandungan teks elemen dengan mengubah suai atribut innerHTML elemen. Contohnya, tukar kandungan teks elemen dengan ID "myDiv" kepada "Hello World!":

rreee

2 Ubah suai gaya elemen

Anda boleh menukar gaya elemen dengan mengubah suai atribut gaya bagi gaya CSS. Contohnya, tukar warna latar belakang elemen dengan ID "myDiv" kepada merah:

var myDiv = document.getElementById("myDiv");
myDiv.innerHTML = "Hello World!";

3 Ubah suai kelas elemen

Anda boleh menukar kelas elemen dengan mengubah suai. atribut className bagi elemen. Contohnya, tukar kelas elemen dengan ID "myDiv" kepada "newClass":

var myDiv = document.getElementById("myDiv");
myDiv.style.backgroundColor = "red";

4 Ubah suai atribut elemen

Anda boleh menukar atribut elemen lain dengan. mengubah suai atribut unsur. Sebagai contoh, tukar atribut alt elemen dengan ID "myDiv" kepada "newAlt":

var myDiv = document.getElementById("myDiv");
myDiv.className = "newClass";

Kesimpulan

JavaScript boleh mencapai kesan dinamik pada halaman web dengan memilih elemen DOM dan mengubah suainya . Artikel ini memperkenalkan pemilihan dan pengubahsuaian dalam JavaScript, termasuk pemilih nama teg, pemilih ID, pemilih kelas, pemilih atribut dan mengubah suai kandungan teks, gaya, kelas dan atribut elemen. Menguasai kemahiran ini membolehkan pembangun menggunakan JavaScript dengan lebih fleksibel dalam pembangunan tapak web.

Atas ialah kandungan terperinci javascript pilih ubah suai. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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