Bagaimana untuk menyemak sama ada URL mengandungi cincang menggunakan JavaScript?

Gambaran Keseluruhan

Gunakan JavaScript untuk menyemak sama ada Uniform Resource Locator (U.R.L.) mengandungi nilai cincang (#text) kerana JavaScript menyertakan beberapa kaedah pra-bina yang menjadikan mendapatkan sasaran tertentu tugas yang mudah. Ini boleh dilakukan dengan menggunakan sifat cincang dalam JavaScript, yang boleh diakses dengan memulakan objek window.location. Ia memudahkan antara muka pengguna dan menyediakan navigasi web yang sangat penting.

Untuk membina penyelesaian ini, kami memerlukan pengetahuan awal tentang topik berikut -

• HTML - Bina rangka halaman anda. Di mana kami akan menggunakan teg

• Acara HTML (onclick(), onchange(), dll.)

• Objek tetingkap JavaScript, objek kedudukan, atribut cincang.

Tatabahasa

Sintaks asas yang digunakan oleh program ini ialah -

window.location.hash

• Window - Ini ialah objek JavaScript yang menentukan bingkai pelayar web. Ia mengendalikan kaedah khusus untuk penyemak imbas anda. Ciri Windows boleh diakses melalui

Sintaks:

• Lokasi - Ia adalah harta objek tetingkap yang mengandungi maklumat tentang URL halaman web semasa.

Sintaks:

• Hash - Ia adalah sifat objek lokasi yang mengandungi teks selepas #. Jika URL mengandungi "/tutorialspoint/#java". Kemudian location.hash akan mengembalikan nilai "java".

Algoritma

• Langkah 1 - Buat butang HTML menggunakan teg

• Langkah 2- Masukkan acara onclick dalam label butang dan masukkan fungsi di dalamnya, seperti . Nama fungsi ditakrifkan pengguna supaya anda boleh menukarnya mengikut keselesaan anda.

• Langkah 3- Cipta fungsi anak panah JavaScript checkHash().

• Langkah 4- Gunakan kaedah objek window lokasi dan kaedah lokasi hash. Simpan hasil window.location.hash dalam pembolehubah.

• Langkah 5- Lulus pembolehubah sebagai syarat dalam if-else.

• step 6 - Jika pembolehubah yang diluluskan dalam if-ELSE adalah benar, kembali "Hash dijumpai", jika pembolehubah yang diluluskan adalah palsu, kembali "Hash tidak dijumpai"

Contoh

Dalam kod yang diberikan, ia mengandungi butang HTML yang mengandungi pengendali acara "onclick()" yang memberikan fungsi yang ditakrifkan pengguna JavaScript "checkHash()". Apabila diklik, fungsi checkHash() dicetuskan.

(window.property/methodName)

Dalam keadaan ini, URL halaman web (http://127.0.0.1:3000/index.html) tidak mengandungi sebarang #teks, seperti yang ditunjukkan dalam bar alamat di bawah, jadi window.location .hash tidak akan dalam pembolehubah yang dirujuk untuk menyimpan apa-apa di dalamnya, jadi ia mengembalikan palsu dan mencetak "Cincang tidak dijumpai

Selepas mengklik pada teks sauh, nilai atribut HTML href="#java" digabungkan dengan URL semasa, jadi window.location.hash mengandungi teks cincang bercantum "#java", jadi mengembalikan nama sebenar bagi hash disimpan dalam pembolehubah " h" dan pembolehubah "h" akan disemak dalam keadaan if-else dan outputnya akan dipaparkan di dalam bekas id "outputVal".

Kesimpulan

Apabila pautan sauh diklik, ia akan mengubah hala kami ke kandungan cincang.

Ini memberikan pengguna antara muka interaktif dengan arah ke kandungan terpaut cincang. Objek lokasi juga mempunyai banyak sifat berfaedah, seperti href, asal, nama laluan dan banyak lagi. Objek Window juga menyediakan pelbagai kaedah untuk mengendalikan penyemak imbas, seperti lokasi, sejarah, buka(), tutup(), dll.

Atas ialah kandungan terperinci Bagaimana untuk menyemak sama ada URL mengandungi cincang menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!