¿Cómo verificar si un valor de cadena de consulta está presente a través de JavaScript?

97

¿Cómo puedo verificar si la cadena de consulta contiene un q=en ella usando JavaScript o jQuery?

mrblah
fuente
Esto también podría ser de ayuda: stackoverflow.com/a/12151322 : contiene información sobre URLSearchParams , por ejemplo: var url = new URLSearchParams(location.search); url.has("my_great_query");devuelve truesi esa cadena de consulta está en su URL. A continuación, puede obtener su valor con url.get("my_great_query");.
user1063287

Respuestas:

109
var field = 'q';
var url = window.location.href;
if(url.indexOf('?' + field + '=') != -1)
    return true;
else if(url.indexOf('&' + field + '=') != -1)
    return true;
return false
LorenVS
fuente
7
Varias rutas de retorno es una elección personal, las uso porque creo que conducen a un código más limpio, ya que me ayudan a evitar declaraciones if anidadas y muestran exactamente lo que está sucediendo en un cierto punto del código. En cuanto a los casos de stict, tanto el lado izquierdo como el derecho siempre serán números, entonces, ¿qué diferencia haría el cambio a operadores de igualdad estricta?
LorenVS
4
¿Código más limpio? ... ¿Por qué no devolver la prueba indexOf, en lugar de colocarla en una declaración IF preliminar totalmente inútil?
James
4
Estoy de acuerdo con JP. Es posible que haya escrito la solución correcta, pero su código es realmente descuidado. ¿Dónde están los tirantes? Debería leer "Las partes buenas", donde se ha demostrado que el código escrito en un estilo sin llaves, falla bajo ciertas condiciones y produce confusión durante el mantenimiento.
2
url.indexOf (field + '=')! = -1 fue suficiente, creo. No importa si es al principio o no
aaaa
2
@yyy No, no lo fue. Si tuviera una cadena de consulta como ?kodiaq=1, entonces llamar url.indexOf('q=')sin prefijarla con &o le ?haría creer que el qparámetro está presente.
michalstanko
115

También puede usar una expresión regular:

/[?&]q=/.test(location.search)
Gumbo
fuente
1
en realidad se vería más como: if (! new RegExp ("[? &] hfPageToken ="). test (s.data)) // si los datos hfPageToken no están presentes en la solicitud {s.data = s.data ? [s.data, tokenParam] .join ("&"): tokenParam; }
Dragos Durlut
9
Solo para aclarar, esto funciona muy bien if(/[?&]q=/.test(location.search)) { alert("match"); }(estaba un poco confundido debido al comentario de @DragosDurlut. :)
Leia
1
Yoda diría con respecto a las expresiones regulares: "Son códigos más cortos ... más fáciles de leer que no".
RayLoveless
24

Usando URL:

url = new URL(window.location.href);

if (url.searchParams.get('test')) {

}

EDITAR: si está triste por la compatibilidad, le sugiero https://github.com/medialize/URI.js/ .

Damien Roche
fuente
4
Agradable, pero sin soporte para IE.
UpTheCreek
1
@UpTheCreek parece tristemente así. Tuve que cambiarlo por una versión compatible. Podemos soñar.
Damien Roche
9

La muestra de código javascript simple que responde a su pregunta literalmente:

return location.search.indexOf('q=')>=0;

La muestra de código javascript simple que intenta encontrar si el parámetro q existe y si tiene un valor:

var queryString=location.search;
var params=queryString.substring(1).split('&');
for(var i=0; i<params.length; i++){
    var pair=params[i].split('=');
    if(decodeURIComponent(pair[0])=='q' && pair[1])
        return true;
}
return false;
Peter Dolberg
fuente
7
El primer ejemplo será verdadero parafooq=bar
mickadoo
4

una variante más, pero casi lo mismo que la solución de Gumbos:

var isDebug = function(){
    return window.location.href.search("[?&]debug=") != -1;
};
Humppakäräjät
fuente
3

esta función le ayuda a obtener el parámetro de la URL en JS

function getQuery(q) {
    return (window.location.search.match(new RegExp('[?&]' + q + '=([^&]+)')) || [, null])[1];
}
Bafi
fuente
2

En los navegadores modernos, esto se ha vuelto mucho más fácil, gracias a la URLSearchParams interfaz. Esto define una serie de métodos de utilidad para trabajar con la cadena de consulta de una URL.

Suponiendo que nuestra URL lo sea https://example.com/?product=shirt&color=blue&newuser&size=m, puede tomar la cadena de consulta usando window.location.search:

const queryString = window.location.search;
console.log(queryString);
// ?product=shirt&color=blue&newuser&size=m

Luego puede analizar los parámetros de la cadena de consulta usando URLSearchParams:

const urlParams = new URLSearchParams(queryString);

Luego, puede llamar a cualquiera de sus métodos en el resultado.

Por ejemplo, URLSearchParams.get()devolverá el primer valor asociado con el parámetro de búsqueda dado:

const product = urlParams.get('product')
console.log(product);
// shirt

const color = urlParams.get('color')
console.log(color);
// blue

const newUser = urlParams.get('newuser')
console.log(newUser);
// empty string

Puede utilizar URLSearchParams.has()para comprobar si existe un determinado parámetro:

console.log(urlParams.has('product'));
// true

console.log(urlParams.has('paymentmethod'));
// false

Para leer más, haga clic aquí .

Plabon Dutta
fuente
0

He usado esta biblioteca antes que hace un buen trabajo de lo que buscas. Específicamente:-

qs.contains(name)
    Returns true if the querystring has a parameter name, else false.

    if (qs2.contains("name1")){ alert(qs2.get("name1"));}
Gavin Gilmour
fuente
0

Esto debería ayudar:

function getQueryParams(){
    try{
        url = window.location.href;
        query_str = url.substr(url.indexOf('?')+1, url.length-1);
        r_params = query_str.split('&');
        params = {}
        for( i in r_params){
            param = r_params[i].split('=');
            params[ param[0] ] = param[1];
        }
        return params;
    }
    catch(e){
       return {};
    }
}
Killswitch
fuente