JavaScript获取当前url路径过程解析

这篇文章主要介绍了JavaScript获取当前url路径过程解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

1、假设当前页完整地址是：http://localhost:61768/Home/Index?id=2&age=18

//获取当前窗口的Url
var url = window.location.href;
//结果：http://localhost:61768/Home/Index?id=2&age=18

//获取当前窗口的主机名
var host = window.location.host;
//结果：localhost:61768

//获取当前窗口的端口
var port = window.location.port;
//结果：61768

//获取当前窗口的路径
var pathname = window.location.pathname;
//结果：/Home/Index

//获取当前文档的Url
var URL = document.URL;
//结果：http://localhost:61768/Home/Index?id=2&age=18

//获取参数
var search = window.location.search;
//结果：?id=2&age=18

2、分隔 url 中的参数

var search = window.location.search;
var age = getSearchString('age', search); //结果：18
var id = getSearchString('id', search); //结果：2
//key(需要检索的键） url（传入的需要分割的url地址，例：?id=2&age=18）
function getSearchString(key, Url) {
  var str = Url;
  str = str.substring(1, str.length); // 获取URL中?之后的字符（去掉第一位的问号）
  // 以&分隔字符串，获得类似name=xiaoli这样的元素数组
  var arr = str.split("&");
  var obj = new Object();

  // 将每一个数组元素以=分隔并赋给obj对象
  for (var i = 0; i < arr.length; i++) {
    var tmp_arr = arr[i].split("=");
    obj[decodeURIComponent(tmp_arr[0])] = decodeURIComponent(tmp_arr[1]);
  }
  return obj[key];
}

3、跳出当前窗口

//跳出当前窗口,打开新窗口
window.open(http://www.baidu.com);

4、document与window

document默示的是一个文档对象，window默示的是一个窗口对象，一个窗口下可以有多个文档对象。

所以一个窗口下只有一个window.location.href，可能有多个document.URL、document.location.href

window.location.href 和 document.location.href 可以被赋值，然后跳转到其它页面，document.URL只能读不能赋值。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • linux shell中curl 发送post请求json格式问题的处理方法

    今天在linux中使用curl发送一个post请求时,带有json的数据,在发送时发现json中的变量没有解析出来 如下 curl -i -X POST -H 'Content-type':'application/json' -d {"BTime":""$btime""} http://api.baidu.com 变量没有做解析 原来在shell中,"" '还是有很大区别的, 把修改后的curl发送贴出 atime=`dat

  • js如何获取图片url的Blob值并预览示例代码

    前言 Blob 对象表示一个不可变.原始数据的类文件对象.Blob 表示的不一定是JavaScript原生格式的数据.File 接口基于Blob,继承了 blob 的功能并将其扩展使其支持用户系统上的文件. 本文主要给大家介绍了关于js获取图片url的Blob值并预览的相关内容,下面话不多说了,来一起看看详细的介绍吧 方法如下 1)使用 XMLHttpRequest 对象获取图片url的Blob值 //获取图片的Blob值 function getImageBlob(url, cb) { var

  • JS中通过url动态获取图片大小的方法小结(两种方法)

    很多时候再项目中,我们往往需要先获取图片的大小再加载图片,但是某些特定场景,如用过cocos2d-js的人都知道,在它那里只能按比例缩放大小,是无法设置指定大小的图片的,这就是cocos2d-js 的坑了,我们必须先获取图片大小,计算比例再对图片进行缩放. 查阅资料,我总结了两种通过url获取图片大小的方法: 1.预加载获取图片大小 var imgLoad = function (url, callback) { var img = new Image(); img.src = url; if

  • 使用JavaScript解析URL的方法示例

    使用JavaScript解析URL的方法示例

    前言 在 Web 开发中,有许多情况需要解析 URL,这篇主要学习如何使用 URL 对象实现这一点.下面话不多说了,来一起看看详细的介绍吧 开始 创建一个以下内容的 HTML 文件,并在浏览器中打开. <html> <head> <title>JavaScript URL parsing</title> </head> <body> <script> // 激动人心的代码即将写在这里 </script> <

  • JS将网址url转化为JSON格式的方法

    网上方法很多,各种奇技淫巧,这里贴上一种较为正常的思路. 主要利用split对获取的字符串不断进行分割,最后获得所需要的格式. 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>将url转化为json数据</title> </head> <script> function

  • VueJS 取得 URL 参数值的方法

    先给大家介绍下VueJS取得URL参数 vuejs取得URL中参数的值 地址:http://localhost:3333/#/index?id=001 结果:001 console.log(this.$route.query.id) PS:下面给大家介绍下vue自定义表单生成器可根据json参数动态生成表单效果 介绍 form-create 是一个可以通过 JSON 生成具有动态渲染.数据收集.验证和提交功能的表单生成器.并且支持生成任何 Vue 组件.结合内置17种常用表单组件和自定义组件,再

  • JS基于Location实现访问Url、重定向及刷新页面的方法分析

    本文实例讲述了JS基于Location实现访问Url.重定向及刷新页面的方法.分享给大家供大家参考,具体如下: js通过Location实现访问Url,重定向,刷新页 web中经常会使用到刷新页面,访问url.重定向请求的功能. javascript提供了许多方法访问,修改当前用户在浏览器中访问的url.所有的这些技术都是基于location对象的.它是作为window对象的属性.你可以生成一个包含当前url的新location对象: var currentURL=window.location

  • java的url方式、本地方式获取json文件内容

    因为工作原因需要读取json文件,最先是使用url方式不符合要求pass.又使用本地方式读取.记录一下方便后期查看. 注:因为资料都是从网上摘抄,如有问题请告知我. 1.url方式 /** * 通过网络访问json并读取文件 * @param url:http://127.0.0.1:80/dashboard/dept_uuid.json * @return:json文件的内容 */ public static String loadJson (String url) { StringBuild

  • js中获取URL参数的共用方法getRequest()方法实例详解

    下面通过一段代码给大家介绍js中获取URL参数的共用方法getRequest()方法,具体代码如下所示: getRequest : function() { var url = location.search; //获取url中"?"符后的字串 var theRequest = new Object(); if (url.indexOf("?") != -1) { var str = url.substr(1); strs = str.split("&am

  • PHP基于curl模拟post提交json数据示例

    本文实例讲述了PHP基于curl模拟post提交json数据.分享给大家供大家参考,具体如下: 这里php模拟post提交json数据操作的关键是在头部设置Content-Type <?php header("Content-type:application/json;charset=utf-8"); $url="http://192.168.10.234:8080/uc/login/loginid"; $param=array( //注册字段 "n

随机推荐