Heim > Web-Frontend > js-Tutorial > So erhalten Sie URL-Parameter mit JavaScript

So erhalten Sie URL-Parameter mit JavaScript

不言
Freigeben: 2018-12-03 09:10:32
Original
3223 Leute haben es durchsucht

Wenn Sie URL-Parameter über JavaScript abrufen und verwenden möchten. In JavaScript können Sie „document.location.search“ verwenden, um die Parameter der URL abzurufen. Da Sie die Zeichenfolge des Parameters jedoch nur unmittelbar nach dem URL-Pfad abrufen können, muss die abgerufene Zeichenfolge analysiert werden, um den Wert jedes Parameters zu erhalten.

So erhalten Sie URL-Parameter mit JavaScript

Schauen wir uns das Beispiel direkt an

Der Code lautet wie folgt

GetParam.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
      <script type="text/javascript">
        window.onload = function onLoad() {
            param = GetQueryString();
            target = document.getElementById("param");
            target.innerHTML = param["q"];
        }
        function GetQueryString() {
            if (1 < document.location.search.length) {
                var query = document.location.search.substring(1);
                var parameters = query.split(&#39;&&#39;);
                var result = new Object();
                for (var i = 0; i < parameters.length; i++) {
                    var element = parameters[i].split(&#39;=&#39;);
                    var paramName = decodeURIComponent(element[0]);
                    var paramValue = decodeURIComponent(element[1]);
                    result[paramName] = decodeURIComponent(paramValue);
                }
                return result;
            }
            return null;
        }
      </script>
</head>
<body>
<div>这是一个参数</div>
    <div id="param"></div>
</body>
</html>
Nach dem Login kopieren

Hinweis:

Die Zeichenfolge im URL-Parameterteil kann über das Attribut „document.location.search“ abgerufen werden. Rufen Sie die zweite und die folgenden Zeichenfolgen ab, indem Sie die Methode substring(1) aufrufen. (Wenn der URL-Parameter „?Q=ABCD&m=30“ lautet, wird „q=ABCD&m=30“ erhalten.)

Anschließend wird die erhaltene Zeichenfolge durch „&“ geteilt. Wenn die erhaltene Zeichenfolge „q=ABCD&m=30“ lautet, wird q=ABCD dem Parameter[0] und m=30 dem Parameter[1] zugewiesen.

Zusätzlich werden die einzelnen Elemente des Parameters durch '=' getrennt, der Wert und der Parametername ermittelt, im assoziativen Ergebnisarray gespeichert und als Rückgabewert zurückgegeben.

function GetQueryString() {
  if (1 < document.location.search.length) {    
     var query = document.location.search.substring(1);
     var parameters = query.split(&#39;&&#39;);
    var result = new Object();    
  for (var i = 0; i < parameters.length; i++) {      
       var element = parameters[i].split(&#39;=&#39;);
      var paramName = decodeURIComponent(element[0]);      
  var paramValue = decodeURIComponent(element[1]);
       result[paramName] = decodeURIComponent(paramValue);
    }
    return result;
  }
  return null;}
Nach dem Login kopieren

Ergebnisse ausführen

Das Ausführen der HTML-Datei führt zu folgendem Effekt im Browser.

So erhalten Sie URL-Parameter mit JavaScript

Fügen Sie den Parameter „q“ am Ende der URL hinzu. (?q=testabc wird am Ende der URL hinzugefügt.)

So erhalten Sie URL-Parameter mit JavaScript

kann die Parameter abrufen und den erhaltenen Parameter „testabc“ auf der Seite ausgeben.

Das obige ist der detaillierte Inhalt vonSo erhalten Sie URL-Parameter mit JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage