javascript - 如何从 url 获取参数到 javascript 或 jquery 文件？

Question

例如js文件包含到页面:

<script src="/js/example/test.js?count=2321"></script>

如何从 url /js/example/test.js?count= 获取值 count in javascript 文件 test.js 2321？

P.S.: 如果我不知道位置键怎么得到？即如何从键中获取值参数？

Answer 1

定义如下所示的方法以从 url 中获取所有键值:

function getUrlVars(url)
{
   var vars = [], hash;
   if(url == undefined || url.indexOf('?') ==  -1)
     return vars;
   var hashes = url.slice(url.indexOf('?') + 1).split('&');
   for(var i = 0; i < hashes.length; i++)
   {
      hash = hashes[i].split('=');
      vars.push({key : hash[0] , value : hash[1]});
   }
   return vars;
}

此方法返回一个对象数组，其中包含 url 的所有可用键/值。

最后，您可以从任何脚本标签获取 src，并像这样获取所有可用的键/值:

$("script").each(function(){
  if($(this).attr("src") != undefined){
    console.log($(this).attr("src") + ":");
    console.log(getUrlVars($(this).attr("src")));
  }
});

$(document).ready(function(){
  function getUrlVars(url)
  {
   var vars = [], hash;
    if(url == undefined || url.indexOf('?') ==  -1)
      return vars;
   var hashes = url.slice(url.indexOf('?') + 1).split('&');
   for(var i = 0; i < hashes.length; i++)
   {
      hash = hashes[i].split('=');
      vars.push({key : hash[0] , value : hash[1]});
   }
   return vars;
  }
  $("script").each(function(){
    if($(this).attr("src") != undefined){
      console.log($(this).attr("src") + ":");
      console.log(getUrlVars($(this).attr("src")));
    }
  });
   
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="/js/example/test.js?count=2321&customKey=1233&customKey2=sdffds"></script>
<script src="/js/example/test1.js?count2=2321&Key2=sdffds"></script>
<script src="/js/example/test2.js?count2=2321&key1=1233"></script>

您还可以使用以下方法从任何 url 获取特定 key :

function getParameterByName(name, url) {
   if (!url) url = window.location.href;
   name = name.replace(/[\[\]]/g, "\\$&");
   var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
       results = regex.exec(url);
   if (!results) return null;
   if (!results[2]) return '';
   return decodeURIComponent(results[2].replace(/\+/g, " "));
}

并像这样获取键的值:

getParameterByName("count", $("script[src*='test.js']").attr("src"))

$(document).ready(function(){
  function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
  }
  
   console.log( getParameterByName("count", $("script[src*='test.js']").attr("src")));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="/js/example/test.js?count=2321"></script>

Edit (Detect current script): 有很多方法可以检测当前脚本标签，你可以找到 HERE ，但我认为最准确的方法是在每个脚本中定义一个方法，并在其上定义一个方法，然后遍历所有脚本以找到您想要的脚本:

function isMe(scriptElem){
   return scriptElem.getAttribute('src') === "Your Current Script Src";
}

var me = null;
var scripts = document.getElementsByTagName("script")
for (var i = 0; i < scripts.length; ++i) {
   if( isMe(scripts[i])){
     me = scripts[i];
   }
}
console.log( getParameterByName("count", $(me).attr("src")));