JavaScript高级程序设计（第四版）笔记location.search的用法

最新推荐文章于 2024-01-18 09:55:33 发布

Silent_crab

最新推荐文章于 2024-01-18 09:55:33 发布

阅读量580

点赞数 1

分类专栏：前端 JavaScript 文章标签： javascript 前端

本文链接：https://blog.csdn.net/Silent_crab/article/details/119763681

版权

前端同时被 2 个专栏收录

36 篇文章 0 订阅

订阅专栏

JavaScript

13 篇文章 0 订阅

订阅专栏

跳过了十一章，promise部分难以理解。
十二章BOM，location对象，一开始也是一头雾水，书本上只是讲述了方法，缺少实际的应用，说实话没明白location里面各个属性到底有什么用。后来网上看了黑马的视频，才有了更深的理解。
location的属性方法，基本上都是对浏览器地址栏的信息进行一些处理。

例如location.href，可以得到当前网页的url
到百度的页面，控制台输入location.href就可以得到百度地址
在这里插入图片描述
location.search，主要是用于两个网页之间信息的传递。

这里建立了两个html文件，index.html和login.html
我要的效果是，在login.html网页中，输入用户名，这个用户名可以在index.html中显示
这是login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form action="index.html">
      <label>用户名：</label> <input type="text" name="uname">
      <input type="submit" value="登录">
    </form>
</body>
</html>

这是index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div></div>
</body>
<script>
    console.log(location.search);
    let params= location.search.substr(1);
    console.log(params);
    //利用‘=‘把字符串分割为数组split('=')
    let arr = params.split('=');
    console.log(arr);
    var div = document.querySelector('div');
    //把数据写入DIV中 decodeURIComponent解码
    div.innerHTML = decodeURIComponent(arr[1]);
</script>
</html>

Silent_crab

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript高级程序设计（第四版）笔记location.search的用法

跳过了十一章，promise部分难以理解。十二章BOM，location对象，一开始也是一头雾水，书本上只是讲述了方法，缺少实际的应用，说实话没明白location里面各个属性到底有什么用。后来网上看了黑马的视频，才有了更深的理解。location的属性方法，基本上都是对浏览器地址栏的信息进行一些处理。例如location.href，可以得到当前网页的url到百度的页面，控制台输入location.href就可以得到百度地址location.search，主要是用于两个网页之间信息的传递。这
复制链接

扫一扫

专栏目录