当前位置: 首页>>代码示例 >>用法及示例精选 >>正文

JQuery Mobile jQuery.mobile.path.parseUrl()用法及代码示例


jQuery.mobile.path.parseUrl( Url )

返回：Object

说明：用于将 URL 及其相关变体解析为对象的实用方法，使访问 URL 的组件变得容易。

  • jQuery.mobile.path.parseUrl( Url )

用于将 URL 及其相关变体解析为对象的实用方法，使访问 URL 的组件变得容易。解析相对变体时，生成的对象将包含缺少组件(如协议、主机等)的空字符串值。另外，在解析没有权限的URL时，比如tel:urls，对象的pathname属性会包含protocol/scheme冒号后的数据。

此函数返回一个对象，该对象包含 URL 的各种组件作为字符串。对象的属性模仿浏览器的位置对象：

hash
URL 的片段组件，包括前导 '#' 字符。
host
URL 的主机和端口号。
hostname
URL 中的主机名。
href
被解析的原始 URL。
pathname
URL 引用的文件或目录的路径。
port
URL 中指定的端口。大多数 URL 依赖于所使用协议的默认端口，因此大多数情况下这可能是一个空字符串。
protocol
URL 的协议，包括结尾的 ':' 字符。
search
URL 的查询组件，包括前导 '?' 字符。

但它还包含其他属性，这些属性提供对其他组件的访问以及一些常见形式的 URL 开发人员访问：

authority
URL 的用户名、密码和主机组件
directory
路径名的目录部分，减去任何文件名。
domain
URL 的协议和权限组件。
filename
路径名组件中的文件名，减去目录。
hrefNoHash
原始 URL 减去片段(散列)组件。
hrefNoSearch
原始 URL 减去查询(搜索)和片段(哈希)组件。
password
权限组件中包含的密码。
username
权限组件中包含的用户名。

例子：

jQuery.mobile.path.parseUrl的各种用途

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery.mobile.path.parseUrl demo</title>
  <link rel="stylesheet" href="//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.css">
  <script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
  <script src="//code.jquery.com/mobile/1.5.0-alpha.1/jquery.mobile-1.5.0-alpha.1.min.js"></script>
  <style>
  #myResult{
    border: 1px solid;
    border-color: #108040;
    padding: 10px;
    }
  </style>
</head>
<body>
 
  <div role="main" class="ui-content">
    <p>The URL used is http://jblas:[email protected]:8080/mail/inbox?msg=1234&type=unread#msg-content</p>
    <input type="button" value="obj.href" id="button1" class="myButton" data-inline="true">
    <input type="button" value="obj.hrefNoHash" id="button2" class="myButton" data-inline="true">
    <input type="button" value="obj.hrefNoSearch" id="button3" class="myButton" data-inline="true">
    <input type="button" value="obj.domain" id="button4" class="myButton" data-inline="true">
    <input type="button" value="obj.protocol" id="button5" class="myButton" data-inline="true">
    <input type="button" value="obj.authority" id="button6" class="myButton" data-inline="true">
    <input type="button" value="obj.username" id="button7" class="myButton" data-inline="true">
    <input type="button" value="obj.password" id="button8" class="myButton" data-inline="true">
    <input type="button" value="obj.host" id="button9" class="myButton" data-inline="true">
    <input type="button" value="obj.hostname" id="button10" class="myButton" data-inline="true">
    <input type="button" value="obj.port" id="button11" class="myButton" data-inline="true">
    <input type="button" value="obj.pathname" id="button12" class="myButton" data-inline="true">
    <input type="button" value="obj.directory" id="button13" class="myButton" data-inline="true">
    <input type="button" value="obj.filename" id="button14" class="myButton" data-inline="true">
    <input type="button" value="obj.search" id="button15" class="myButton" data-inline="true">
    <input type="button" value="obj.hash" id="button16" class="myButton" data-inline="true">
    <div id="myResult">The result will be displayed here</div>
  </div>
<script>
$(document).ready(function() {
 
   $( ".myButton" ).on( "click", function() {
    	// Parsing the Url below results an object that is returned with the
    // following properties:
    //
    //  obj.href:         http://jblas:[email protected]:8080/mail/inbox?msg=1234&amp;type=unread#msg-content
    //  obj.hrefNoHash:   http://jblas:[email protected]:8080/mail/inbox?msg=1234&amp;type=unread
    //  obj.hrefNoSearch: http://jblas:[email protected]:8080/mail/inbox
    //  obj.domain:       http://jblas:[email protected]:8080
    //  obj.protocol:     http:
    //  obj.authority:    jblas:[email protected]:8080
    //  obj.username:     jblas
    //  obj.password:     password
    //  obj.host:         mycompany.com:8080
    //  obj.hostname:     mycompany.com
    //  obj.port:         8080
    //  obj.pathname:     /mail/inbox
    //  obj.directory:    /mail/
    //  obj.filename:     inbox
    //  obj.search:       ?msg=1234&amp;type=unread
    //  obj.hash:         #msg-content</strong>
 
    var obj = $.mobile.path.parseUrl("http://jblas:[email protected]:8080/mail/inbox?msg=1234&type=unread#msg-content");
    var myChoice = eval( this.value );
 
    $( "#myResult" ).html( myChoice );
 })
});
</script>
 
</body>
</html>

演示：

相关用法


注：本文由纯净天空筛选整理自jquerymobile.com大神的英文原创作品 jQuery.mobile.path.parseUrl()。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。