¿Cómo leer un hash con un signo «&» en la URL?

Es una situación muy común en el desarrollo web donde los usuarios quieren extraer o leer información de cualquier URL. En caso de no disponibilidad del código del lado del servidor, el programador puede hacer uso de JavaScript o jQuery para leer la información. Para leer la URL con un signo &, podemos usar la función split(). Mediante esa función, podemos obtener fácilmente el parámetro de URL como una string. El programador puede recuperar la string de parámetros y almacenarla en una variable usando JavaScript.

Sintaxis:

var q = url.split('?')[1];

Aquí URL es cualquier string de URL de ejemplo. Para obtener parámetros de string de consulta de URL . Si la URL tiene muchos parámetros en la string de consulta, el siguiente fragmento de código lo guiará para analizar y almacenar variables a las que se puede acceder.

var vars = [], hash;
var q = url.split('?')[1];
var fullParameter = q;
            
if(q != undefined) {
    q = q.split('&');
                
    for(var i = 0; i < q.length; i++) {
        hash = q[i].split('=');
        vars.push(hash[1]);
        vars[hash[0]] = hash[1];                
    }
            
    // Get hash parameter
    var hashParameter = hash[1];
    var hashstr= hashParameter.split('#')[1];
    alert("# Parameter :" + hashstr);
}

Para usar cualquier parámetro, el usuario puede acceder al valor por nombre de parámetro. Por ejemplo, si la URL contiene la string de consulta “?var1=nombre&var=apellido&var3=dirección? , el usuario puede acceder al valor de «var1» usando:

alert(vars['var1']);

El siguiente ejemplo ilustra el enfoque anterior:

Ejemplo: este ejemplo lee parámetros de URL que incluyen hash junto con el signo «&» en la URL dada.

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to read a hash with
        an & sign in the URL?
    </title>
      
    <script src=
"https://code.jquery.com/jquery-3.3.1.min.js">
    </script>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        Get parameters and anchor
        of URL using jQuery
    </b>
      
    <p>
        Click on the button below to
        read parameters for any URL
    </p>
  
    <button id="btn">
        Read hash with & sign:
    </button>
      
    <div style="height:10px;"></div>
  
    <div id="Ampdiv"></div>
      
    <script>
        var url = 
'http://www.geeksforgeeks.com/search?var1=term&var2=english#results';
        $('#btn').click(function() {
            readHash(url);
        });
  
        function readHash(url) {
            var vars = [], hash;
            var q = url.split('?')[1];
            var fullParameter = q;
  
            if (q != undefined) {
                q = q.split('&');
  
                for (var i = 0; i < q.length; i++) {
                    hash = q[i].split('=');
                    vars.push(hash[1]);
                    vars[hash[0]] = hash[1];
                }
                  
                // Get hash parameter
                var hashParameter = hash[1];
                var hashstr = hashParameter.split('#')[1];
                alert("# Parameter :" + hashstr);
            }
              
            $("#Ampdiv").text(fullParameter);
        }
    </script>
</body>
  
</html>

Producción:

Antes de hacer clic en el botón:
Después de hacer clic en el botón:

Publicación traducida automáticamente

Artículo escrito por geetanjali16 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta Cancelar la respuesta