Maison > interface Web > Questions et réponses frontales > javascript remplacer l'URL

javascript remplacer l'URL

王林
Libérer: 2023-05-16 12:25:07
original
1494 Les gens l'ont consulté

Avant-propos

À l'ère d'Internet, les sites Web ou les applications doivent souvent remplacer les URL en raison des besoins des entreprises. À l'heure actuelle, JavaScript est devenu un outil très utile. Cet article analysera l'utilisation de l'URL de remplacement JavaScript à travers des exemples et fournira aux lecteurs des conseils pour une compréhension approfondie de JavaScript.

Texte

L'URL de remplacement JavaScript fait référence au remplacement d'une certaine partie du contenu de la page Web par une autre URL. Cette opération peut être réalisée via l'objet de localisation en JavaScript. L'objet d'emplacement peut accéder aux informations URL du document actuel et peut extraire diverses parties de l'URL pour définir une nouvelle URL. Regardons un exemple de code JavaScript de base pour remplacer une URL :

function redirect() {
  location.replace("http://www.baidu.com"); // 替换网址
}
redirect(); // 调用函数
Copier après la connexion

Dans le code ci-dessus, la méthode location.replace() est utilisée pour remplacer l'URL actuelle et la pointer vers "http://www.baidu.com". , et enfin appeler et exécuter via la fonction redirect().

En plus d'utiliser la méthode location.replace(), vous pouvez également utiliser les méthodes location.href et location.assign() pour remplacer l'URL. La fonction de ces deux méthodes est la même, pointant l'URL actuelle vers l'URL. nouvelle URL.

function redirect() {
  location.href = "http://www.baidu.com"; // 替换网址
}
redirect(); // 调用函数

function redirect() {
  location.assign("http://www.baidu.com"); // 替换网址
}
redirect(); // 调用函数
Copier après la connexion

Dans le code ci-dessus, les méthodes location.href et location.assign() peuvent également pointer l'URL actuelle vers une nouvelle URL.

Dans les applications pratiques, nous devons souvent effectuer un remplacement dynamique d'URL en fonction de différentes situations. Par exemple, obtenez le contenu saisi par l'utilisateur via la zone de saisie, puis transmettez le contenu saisi en tant que paramètre à l'URL pour obtenir un remplacement dynamique.

function redirect() {
  var keyword = document.getElementById("searchInput").value; // 获取输入框中的内容
  var newUrl = "https://www.baidu.com/s?wd=" + keyword;
  location.href = newUrl; // 替换新的 URL
}
Copier après la connexion

Dans le code ci-dessus, nous obtenons d'abord le contenu de la zone de saisie avec l'identifiant "searchInput", puis utilisons le signe plus pour le fusionner dans une nouvelle URL, et enfin le remplaçons par l'URL actuelle.

Les URL de remplacement JavaScript peuvent également être utilisées pour implémenter des sauts de page et des redirections. Voici un exemple de code pour le saut de page et la redirection via JavaScript :

// 页面跳转
function jumpToPage() {
  var pageNum = document.getElementById("pageNumInput").value;
  var newUrl = "http://www.example.com/page_" + pageNum + ".html";
  location.href = newUrl;
}

// 重定向
function redirect() {
  location.replace("http://www.example.com"); // 重定向到新的网站
}
redirect(); // 调用函数
Copier après la connexion

Dans l'exemple de code ci-dessus, nous obtenons le saut de page en obtenant le contenu saisi par l'utilisateur, puis en l'intégrant à la nouvelle URL en tant que paramètre et en le redirigeant.

Conclusion

Le remplacement d'URL JavaScript est une fonction très pratique qui est souvent nécessaire dans les applications pratiques. Grâce à l'exemple de code présenté dans cet article, les lecteurs peuvent rapidement maîtriser l'utilisation de JavaScript pour remplacer les URL et implémenter des fonctions telles que le remplacement dynamique, les sauts de page et les redirections. Il convient de noter que lors du remplacement d'URL, vous devez faire attention au format et à la syntaxe de l'URL, sinon le remplacement et l'accès normaux ne seront pas obtenus.

Références

  1. W3school. Objet de localisation JavaScript [EB/OL]. (2022-05-28) [2022-06-05]. Emplacement des documents Web MDN [EB/OL]. (2022-05-23) [2022-06-05].

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal