ThatManK Mobile Article

获取URL参数

Category: JS Tutorial: DOM实战 Published: 2026-04-07 13:58 Views: 21 Likes: 0 Comments: 0

一、登录页

<!DOCTYPE html>
<html lang="en">
  <head></head>

  <body>
    <form action="index.html">
      用户名： <input type="text" name="uname" />
      <input type="submit" value="登录" />
    </form>
  </body>
</html>

二、获取参数 index.html

<!DOCTYPE html>
<html lang="en">
  <head> </head>

  <body>
    <div></div>
    <script>
      console.log(location.search); // ?uname=andy

      // 1.先去掉？  substr('起始的位置', 截取几个字符);
      var params = location.search.substr(1);
      console.log(params); // // uname=andy

      // 2. 利用=把字符串分割为数组 split('=');
      var arr = params.split("=");
      console.log(arr); // ["uname", "ANDY"]

      // 3.把数据写入div中
      var div = document.querySelector("div");
      div.innerHTML = arr[1] + "欢迎您";
    </script>
  </body>
</html>