zoukankan      html  css  js  c++  java
  • 如何通过地址栏传递参数及获得参数

    在通过地址栏进行参数的传递及取值时,首先应该了解一下URL的组成部分及其每部分的取得方法和作用说明:

    URL即:统一资源定位符 (Uniform Resource Locator, URL)

    完整的URL由这几个部分构成:

    scheme://host:port/path?query#fragment

    scheme:通信协议

    常用的通信协议有:http,ftp,maito等

    host:主机

    服务器(计算机)域名系统 (DNS) 主机名或 IP 地址。

    port:端口号

    整数,可选,省略时使用方案的默认端口,如http的默认端口为80。

    path:路径

    由零或多个"/"符号隔开的字符串,一般用来表示主机上的一个目录或文件地址。

    query:查询

    可选,用于给动态网页(如使用CGI、ISAPI、PHP/JSP/ASP/ASP.NET等技术制作的网页)传递参数,可有多个参数,用"&"符号隔开,每个参数的名和值用"="符号隔开。

    fragment:信息片断

    字符串,用于指定网络资源中的片断。例如一个网页中有多个名词解释,可使用fragment直接定位到某一名词解释。(也称为锚点.)

    对于这样一个URL:http://www.jbxue.com:80/fisker/post/0703/window.location.html?ver=1.0&id=6#imhere

    可以用JavaScript获得其中的各个部分。

    1,window.location.href

    整个URl字符串(在浏览器中就是完整的地址栏)

    本例返回值: http://www.jbxue.com:80/fisker/post/0703/window.location.html?ver=1.0&id=6#imhere

    2,window.location.protocol

    URL 的协议部分

    本例返回值:http:

    3,window.location.host

    URL 的主机部分

    本例返回值:www.jbxue.com

    4,window.location.port

    URL 的端口部分

    如果采用默认的80端口(update:即使添加了:80),那么返回值并不是默认的80而是空字符

    本例返回值:""

    5,window.location.pathname

    URL 的路径部分(就是文件地址)

    本例返回值:/fisker/post/0703/window.location.html

    6,window.location.search

    查询(参数)部分

    除了给动态语言赋值以外,我们同样可以给静态页面,并使用javascript来获得相信应的参数值

    本例返回值:?ver=1.0&id=6

    7,window.location.hash

    锚点

    本例返回值:#imhere 那么就可以用这个方法取到指定参数。

    以下则通过一个实例来进行对通过地址栏传递参数及取值的了解。

    如果要通过URL进行传值.则需要把要传递的信息接在URL上,如:

    post.html

     1 <html>
     2 <head>
     3     <meta charset="UTF-8"/>
     4     <title></title>
     5     <script>
     6         function post() {
     7             var url = "read.html?name=" + escape(document.all.name.value);
     8             url += "&password=" + escape(document.all.password.value);
     9             window.location = url;
    10         };
    11     </script>
    12 </head>
    13 <body>
    14 
    15 姓名:<input type="text" name="name"/><br/>
    16 
    17 密码:<input type="text" name="password"/><br/>
    18 
    19 <input type="button" value="post" onClick="post()"/>
    20 
    21 </body>
    22 </html>


    在把参数接在URL后,这时就需要对地址栏里的参数进行取值并且将其输出,具体实现方法如下: 

    read.html

     1 <html>
     2 <head>
     3     <title></title>
     4     <script>
     5         window.onload = function () {
     6 
     7             var url = window.location.search;
     8 
     9             var request = new Object();
    10 
    11             if (url.indexOf("?") != -1) {  
    12             <!--判断是否存在,如果返回-1,则表明不存在-->
    13 
    14                 var str = url.substr(1);
    15                 <!--从第1个字符开始截取-->
    16 
    17                 var strs = str.split("&");
    18                 <!--表示以“&’”为分隔符进行分隔,返回的是一个数组-->
    19 
    20                 for (var i = 0; i < strs.length; i++) {
    21                     request[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
    22                 }
    23             }
    24             alert("name=" + request["name"]);
    25             alert("password=" + request["password"]);
    26         };
    27     </script>
    28 </head>
    29 <body>
    30 </body>
    31 </html>
  • 相关阅读:
    690. Employee Importance 员工重要性
    682. Baseball Game 棒球比赛计分
    680. Valid Palindrome II 有效的回文2
    553. Optimal Division 最佳分割
    服务器oracle数据库定时备份
    数据类型和抽象数据类型
    静态链表和动态链表的区别:
    it网站
    java 移动开发获取多级下拉框json数据的类和mobile-select-area插件
    redis持久化之aof篇
  • 原文地址:https://www.cnblogs.com/Vayne-N/p/7243000.html
Copyright © 2011-2022 走看看