唯品秀博客
首页 > 前端开发 > Javascript > 你不熟悉的window.location对象详解

你不熟悉的window.location对象详解

2019年04月08日 作者:管理员 192次浏览

最近做个特别古老的项目,但不管怎样,也是一次填坑长见识的机会,不管多么烂的项目,总会让你多少长点知识,在这个项目中,我见到很多js原生的一些方法,其中以前没怎么去用但感觉还是有点用的一个对象window.location出现的频率还挺高

在谷歌中搜索关键词"google",打开chrome的调试工具,在Console一栏中输入window.location,出现如下图所示(包含location的多个属性):

接下来以http://www.myurl.com:8866/test?id=123&username=xxx作为栗子,介绍一下location的常用属性:

window.location.href(当前URL)

1
2
结果如下:
http://www.myurl.com:8866/test?id=123&username=xxx

window.location.protocol(协议)

1
2
结果如下:
http:

window.location.host(域名 + 端口)

1
2
结果如下:
www.myurl.com:8866

window.location.hostname(域名)

1
2
结果如下:
www.myurl.com

window.location.port(端口)

1
2
结果如下:
8866

window.location.pathname(路径部分)

1
2
结果如下:
/test

window.location.search(请求的参数)

1
2
结果如下:
?id=123&username=xxx

window.location.origin('?'前边的URL)

1
2
结果如下:
http://www.myurl.com:8866

是否包含某个字符规则

JavaScript test() 方法,test() 方法用于检测一个字符串是否匹配某个模式,如果字符串中有匹配的值返回 true ,否则返回 false。和indexOf以及exec( )有点像

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<script>
var str="Hello world!";
//查找"Hello"
var patt=/Hello/g;
var result=patt.test(str);
document.write("返回值: " +  result);
//查找 "Runoob"
patt=/Runoob/g;
result=patt.test(str);
document.write("<br>返回值: " +  result);
</script>
   
</body>
</html>
//结果
返回值: true
返回值: false

「两年博客,如果觉得我的文章对您有用,请帮助本站成长」

赞( 2 ) 打赏

谢谢你请我吃鸡腿*^_^*

支付宝
微信
2

谢谢你请我吃鸡腿*^_^*

支付宝
微信

上一篇:

下一篇:

共有 0 条评论 - 你不熟悉的window.location对象详解

博客简介

唯品秀博客: weipxiu.com,一个关注Web前端开发技术、关注用户体验、坚持更多原创实战教程的个人网站,愿景:成为宇宙中最具有代表性的前端博客,期待您的参与,了解更多...

精彩评论

友情链接

他们同样是一群网虫,却不是每天泡在网上游走在淘宝和网游之间、刷着本来就快要透支的信用卡。他们或许没有踏出国门一步,但同学却不局限在一国一校,而是遍及全球!

站点统计

  • 文章总数: 180 篇
  • 草稿数目: 2 篇
  • 分类数目: 13 个
  • 页面总数: 21 个
  • 评论总数: 850 条
  • 链接总数: 14 个
  • 标签总数: 357 个
  • 建站时间: 857 天
  • 注册用户: 463 人
  • 访问总量: 8682349 次
  • 最近更新: 2019年4月21日
服务热线:
 173xxxx7240

 QQ在线交流

 旺旺在线