gpt4 book ai didi

Javascript 在页面更改时保留 URL 参数

转载 作者:行者123 更新时间:2023-12-02 22:28:34 24 4
gpt4 key购买 nike

我正在使用 Vanilla Javascript,

我有两个页面,page01.htmlpage02.html 这些页面共享相同的导航系统。

我想在 page01 的 url 中加载一个参数,当我点击导航上的 page02 后,page02 将加载该参数在其 URL 中。

示例:

  1. 我在page01.html
  2. 我将参数加载到 URL 中,所以现在我有 page01.html/?param=X
  3. 我点击菜单项 page02
  4. 我想加载 page02.html/?param=X

有没有办法在不使用 localStorage 和 sessionStorage 的情况下做到这一点?

最佳答案

这是一个使用普通 JavaScript 的简单解决方案:

Page01.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>

<div>Page 1</div>

<a href="page02.html">go to page 2</a>

<script>
var linkToPage2 = document.querySelector("a[href='page02.html']");
linkToPage2.addEventListener("click", function(e){
e.preventDefault();
if(location.search){
window.location.href = "page02.html" + location.search;
}
});

</script>
</body>
</html>

Page02.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>

<div>Page 2</div>

<a href="page01.html">go to page 1</a>

<script>
var linkToPage1 = document.querySelector("a[href='page01.html']");
linkToPage1.addEventListener("click", function(e){
e.preventDefault();
if(location.search){
window.location.href = "page01.html" + location.search;
}
});
</script>
</body>
</html>

关于Javascript 在页面更改时保留 URL 参数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58986213/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com