當前位置: 首頁>>代碼示例 >>用法及示例精選 >>正文

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()。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。