Contoh untuk menerangkan cara menggunakan HTML untuk melompat ke halaman dengan mengklik elemen Butang

Dalam HTML, anda boleh menggunakan teg untuk melompat ke halaman, tetapi bagaimana untuk melompat ke halaman melalui butang? Ini memerlukan penggunaan teg Artikel ini akan memperkenalkan cara mengklik elemen Butang untuk melompat ke halaman dalam HTML.

1. Sintaks asas Butang HTML

Untuk melaksanakan lompatan halaman menggunakan Butang HTML, anda perlu menambah atribut onclick dalam teg kemudian tulis dalam nilai atribut Masukkan kod JavaScript untuk mencapai lompatan halaman Sintaks asas adalah seperti berikut:

Lompat halaman<. ;/button>

Antaranya, window.location.href ialah sebahagian daripada kod JavaScript dan mewakili alamat URL halaman untuk dilawati.

2. Kod contoh lompat halaman Butang HTML

Berikut ialah contoh kod untuk Butang HTML untuk melaksanakan lompatan halaman:

<title>HTML Button跳转页面</title>

<button onclick="window.location.href=&#39;https://www.baidu.com/&#39;">前往百度</button>

Dalam kod di atas, apabila butang "Pergi ke Baidu" diklik, ia akan melompat ke tapak web rasmi Baidu.

3. Butang HTML melompat ke halaman laluan relatif

Dalam pembangunan sebenar, selalunya perlu untuk melompat ke halaman lain dalam tapak web yang sama. Dalam kes ini, laluan relatif boleh digunakan, dan Bukan alamat URL lengkap. Kod sampel adalah seperti berikut:

<title>HTML Button跳转页面</title>

关于我们

Dalam kod di atas, apabila butang "Tentang Kami" diklik, ia akan melompat ke halaman about.html direktori yang sama.

4. Gunakan JavaScript untuk melaksanakan lompatan Butang HTML

Selain menulis terus kod JavaScript dalam atribut onclick untuk melaksanakan lompatan halaman, anda juga boleh melaksanakan lompatan halaman melalui fungsi . Kod sampel adalah seperti berikut:

<title>HTML Button跳转页面</title>

跳转页面



Dalam kod di atas, apabila butang "Lompat Halaman" diklik, fungsi dinamakan goToPage akan dipanggil Fungsi, lompat halaman dilaksanakan di dalam fungsi. 
Butang HTML melaksanakan operasi kembali dan muat semula
Selain melompat ke halaman lain, Butang HTML juga boleh melaksanakan operasi kembali dan muat semula. Kod sampel adalah seperti berikut: 



<title>HTML Button跳转页面</title>

 
返回
刷新



Dalam kod di atas, apabila butang "Kembali" diklik, ia akan kembali ke halaman sebelumnya, dan Mengklik butang "Muat Semula" akan menyegarkan halaman semasa. 
Ringkasnya, Butang HTML adalah salah satu elemen penting untuk merealisasikan lompat halaman, kembali, menyegarkan dan fungsi lain. Dengan menguasai sintaks asas dan pengetahuan berkaitan Butang HTML, anda boleh melaksanakan pelbagai operasi dengan mudah dan menyediakan alatan yang mudah untuk pembangunan web. 
Atas ialah kandungan terperinci Contoh untuk menerangkan cara menggunakan HTML untuk melompat ke halaman dengan mengklik elemen Butang. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!