Préface
Tout d'abord, nous devons savoir ce qu'est la recherche. La recherche est une propriété de Window.Location. Par exemple:
Tout d'abord, nous avons une URL ici, qui est http://www.a.com/list/2.html?page=2&color=4&size=3#pic.
Lorsque nous accéderons à cette adresse, ouvrez la console, entrez Window.Location et nous obtiendrons le résultat dans le chiffre suivant
Comme mentionné ci-dessus, ce que nous voulons utiliser est la partie de la boîte dans l'image ci-dessus.
Pourquoi avez-vous besoin de faire fonctionner cela?
Par exemple, si je dois passer à la troisième page de la deuxième page, je dois mettre à jour la page ci-dessus = 2 à page = 3 et m'assurer que d'autres paramètres sont conservés.
Ou, il n'y avait pas de résultat de recherche au début (comme la première page de la liste générale, il n'y avait rien), mais maintenant j'ai besoin d'ajouter Page = 2.
Ensuite, j'ai besoin de savoir sur quelle page je suis maintenant, c'est-à-dire que je dois obtenir la valeur de la page.
Ainsi, une recherche est requise. Maintenant, nous sommes séparés des extrémités avant et arrière, la recherche est une méthode très importante pour la configuration des paramètres.
Méthode de construction
Obtenez une valeur de paramètre spécifiée dans la recherche
Prenez Baidu et nous avons trouvé la méthode suivante:
fonction getQueryString (name) {var reg = new regexp ("(^ | &)" + name + "= ([^ &] *) (& | $)"); var r = window.location.search.substr (1) .match (reg); if (r! = null) return Unescape (r [2]); retourner null;}Méthode Source: Méthode pour obtenir des paramètres de barre d'adresse à l'aide de JS
Méthode à fonction complète
Je voulais à l'origine écrire une idée de mise en œuvre, mais je ne m'en souvenais pas pendant un certain temps, donc je l'ai directement donné à la méthode finale:
fonction funcUrl (nom, valeur, type) {var loca = window.location; var subst substanl = type == undefined? loca.origin + loca.pathname + "?" : ""; var query = loca.search.substr (1); // S'il n'y a pas de transmission de paramètres, la valeur de recherche de retour ne contient pas de point d'interrogation si (name == undefined) {return query} // s'il n'y a pas de transmission de valeur, renvoie la valeur du paramètre à être questionn + "= ([^ &] *) (& | $)")); return val! = null? UnEscape (val [2]): null;}; var url; if (query == "") {// s'il n'y a pas de valeur de recherche, renvoyez l'Urlurl avec le paramètre annexé = BUSURL + name + "=" + valeur;} else {// s'il n'y a pas de valeur de recherche, modifie la valeur correspondante ded query.split ("&"); for (var i = 0; i <arr.length; i ++) {arr [i] = arr [i] .split ("="); obj [arr [i] [0]] = arr [i] [1];}; obj [name] = valeur; url = busUrl + JSON.StRINGIFY (OBJ) .replace (/ [/ "/ {/}] / g," "). Remplace (//: / g," = "). Remplace (//, / g," & ");}; retour URL;}Comment utiliser
funcurl () obtient la valeur de recherche complète (sans compter les points d'interrogation)
Funcurl (nom) renvoie la valeur du nom dans l'URL (intégrer le paragraphe précédent des méthodes des autres)
funcurl (nom, valeur) définir la valeur du nom dans la recherche sur la valeur et renvoyer l'URL complète
Renvoyez un contenu tel que http://www.a.com/list/2.html?page=2&color=4&size=3#pic
Funcurl (nom, valeur, type) fonctionne comme le troisième élément, mais cela ne renvoie que la chaîne de recherche mise à jour
Le type ici peut être n'importe quel caractère, comme 1;
RETOUR DE CONTENU Exemple Page = 2 & Color = 4 & size = 3;
Généralement utilisé pour obtenir des paramètres à partir de l'URL, puis de la stationnement sur l'interface
résumé
Je voulais à l'origine trouver un plug-in prêt à utiliser, mais il était trop grand pour comprendre ou pas facile à utiliser. Bien sûr, c'était principalement parce que mon niveau était trop pauvre.
J'ai donc fait une roue pour jouer avec. Bien que le code ne soit pas assez élégant, il répond toujours à mes besoins. Si vous avez de meilleures suggestions, laissez-moi un message.
En fait, il est principalement utilisé avec Vue, mais il n'y a pas de contenu Vue ici, il n'est donc pas considéré comme une série de tutoriels pour Vue.
Ce qui précède est la description complète de certaines méthodes et fonctions de la recherche dans l'URL de l'opération JavaScript qui vous est présentée par l'éditeur. J'espère que cela vous sera utile. Si vous avez des questions, veuillez me laisser un message et l'éditeur vous répondra à temps. Merci beaucoup pour votre soutien au site Web Wulin.com!