Bagaimanakah Saya Boleh Memanipulasi dan Mengubah Suai Parameter URL Menggunakan JavaScript?

Tukar Parameter URL dan Tentukan Lalai Menggunakan JavaScript

Dengan URL yang dijana secara dinamik menjadi semakin berleluasa, adalah penting untuk mempunyai fleksibiliti untuk memanipulasi parameter URL dengan cekap. Dalam artikel ini, kami akan meneroka cara mengubah suai dan menambah parameter pada URL menggunakan JavaScript.

Menukar Nilai Parameter

Andaikan anda mempunyai URL yang serupa dengan yang disediakan:

site.fwx?position=1&archiveid=5000&columns=5&rows=20&sorting=ModifiedTimeAsc

Untuk mengubah suai parameter 'rows' kepada nilai tertentu, katakan 10, anda boleh menggunakan kod berikut :

const newUrl = updateURLParameter(window.location.href, 'rows', 10);

Fungsi kemas kiniURLParameter menyemak sama ada Parameter 'rows' wujud. Jika ia berlaku, ia menggantikan nilainya dengan yang ditentukan. Jika ia tidak wujud, ia menambah parameter pada penghujung URL.

Menambah Parameter Baharu

Sebagai alternatif, jika parameter 'baris' tidak wujud dalam URL awal, anda boleh menambahnya menggunakan fungsi yang sama seperti berikut:

const newUrl = updateURLParameter(window.location.href, 'rows', 10);

Kod ini mencipta URL baharu dengan parameter 'rows' dan nilainya ditetapkan kepada 10.

Pelaksanaan Fungsi

Berikut ialah pelaksanaan berfungsi sepenuhnya fungsi updateURLParameter:

function updateURLParameter(url, param, paramVal) {
  const newAdditionalURL = "";
  const tempArray = url.split("?");
  const baseURL = tempArray[0];
  let additionalURL = tempArray[1];
  let temp = "";

  if (additionalURL) {
    const tmpAnchor = additionalURL.split("#");
    additionalURL = tmpAnchor[0];
    additionalURL = additionalURL.split("&");

    for (const key in additionalURL) {
      if (additionalURL[key].split('=')[0] !== param) {
        newAdditionalURL += temp + additionalURL[key];
        temp = "&";
      }
    }
  }

  const rows_txt = temp + "" + param + "=" + paramVal;
  return baseURL + "?" + newAdditionalURL + rows_txt;
}

Untuk menggunakan fungsi ini, hanya masukkan URL semasa, parameter yang anda ingin ubah suai atau tambah, dan nilainya. Fungsi ini akan mengembalikan URL baharu dengan perubahan yang ditentukan dibuat.

Dengan teknik JavaScript ini, anda boleh memanipulasi parameter URL secara dinamik, menjadikannya mudah untuk menyesuaikan dan mengawal gelagat aplikasi web anda.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Memanipulasi dan Mengubah Suai Parameter URL Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!