JavaScript 在整个站点中持久化搜索查询

JavaScript persist a search query through out the whole site

本文关键字：持久化 搜索 查询 站点 JavaScript      更新时间：2023-09-26

我目前正在使用以下JavaScript从html表单中获取查询（例如，http://localhost:49781/HTML/index.html?inputName=Marcus

）： 
function setSignedName() {
    if (window.location.search.indexOf("=") >= 0) {
        var split = window.location.search.split("=");
        document.getElementById("signed_in_name").innerHTML += split[1];
    } else {
        document.getElementById("signed_in_name").innerHTML = "Not signed in";
    }

运行脚本将得到结果：马库斯。

我希望这个字符串在我的网站上持久存在，所以当用户导航到另一个页面时，inputName 仍然是 Marcus。

实现这一目标的最佳方法是什么？

编辑：这种方法仅用于显示/非生产用途，我知道使用像PHP这样的服务器端语言是最好的方法。

我相信

最好的方法是使用localStorage。它适用于所有主流浏览器，并且易于使用：

function setSignedName() {
    var userName = "";
    if (window.location.search.indexOf("=") >= 0) {
        var split = window.location.search.split("=");
        userName += split[1];
    } else {
        userName = "Not signed in";
    }
    document.getElementById("signed_in_name").innerHTML = userName;
    localStorage.setItem("userName", userName);
}

要访问它：

var userName = localStorage.getItem("userName");

就是这样。在收藏夹浏览器的开发人员工具 （F12） 的"资源"选项卡中检查它。

您需要通过服务器端语言的GET参数重新填充它，或者如果您想一起破解它，请使用cookie并在页面加载时使用"pushState"使用JavaScript重新填充它。

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history#The_pushState（）_method

相关文章：