Javascript 通过链接保持值更改

对于学校作业，我必须创建一个页面，该页面根据单击的链接而变化。
更清楚地说，我从一个页面开始，页面上有不同的链接，无论我点击它会给同一个html页面带来什么，但是它的内容必须根据JavaScript点击的链接而改变

我认为最简单的方法是在点击时获取点击链接的id，根据它的不同，页面内容会发生变化，但我不能通过页面变化来保持这个值

---

你有什么想法吗？（顺便说一句，我有权为这个项目寻求帮助）。

像这样的事情应该会让你开始

函数myFunc（e）{
e、 预防默认值（）；
设aa=event.target.innerText；
控制台日志（aa）
const msg=document.getElementById（'msg'）；
msg.innerText='Hello:'+aa；
msg.classList.add（'wow'）；
}

。哇{
宽度：90%；
填充：20px 50px；
边缘顶部：20px；
字体大小：3rem；
颜色：耐火砖；
背景：小麦；
边框：1px实心橙色；
}

---

一个使用HTML和CSS根据

散列显示页面不同部分的基本示例


.page{
显示：无；
}
.第页：目标{
显示：块；
}




内容1
内容2
我误解了你的问题。请忽略我的第一个答案，但我会把它留在那里供你参考

您要查找的内容称为查询字符串（有时称为get字符串）。查询字符串以以下格式附加到url：

https://example.com?varname=varvalue&nuthervar=different value

因此，您可以如下配置锚定标记：

<a href="next_page_to_view.html?name=bob">Bob</a>
<a href="next_page_to_view.html?name=sam">Sam</a>

使用我的第一个错误答案中提供的javascript示例，将特定于用户的消息转换为div（而不是alert（）消息）

参考：

我们讨论的是单页应用程序吗？您可以使用url的哈希部分来确定要显示的内容。听起来您可能需要。但是请进一步澄清一下要求，因为如果它只是一个简单的不同内容，取决于url，那么根本不需要使用历史api。这似乎是我需要的，但它能通过页面更改工作吗？我的意思是，在我的例子中，这里的链接“Bob”和“Sam”是href，因此加载新页面可能会重置所有这些no？当我使用这些链接时，当我们更改页面时，控制台中不会显示任何内容。这就是我想做的avoid@Jo_Byr第一个代码片段是一个完全不用JS就可以实现的示例。第二个示例当前记录哈希更改。在那里，您可以用一些更新页面的代码替换
console.log
。抱歉，这不是我需要的。我需要有一个模块化的html页面。你的命题依赖于2。我真的需要一个，因为页面上有12个链接，所以我无法创建12个几乎相同的页面。我的第一个答案假设您正在更新包含链接的同一页面。此答案假设所有链接都导航到第二个页面，并且您希望根据单击的链接中的查询字符串以不同方式更新该第二个页面。也许您不明白第二个答案如何允许您根据单击的链接将
下一页更新为\u view.html
？否则，请进一步解释以帮助我理解。因此，使用此解决方案，我只能编写一个html文档，并且导航器中的结果可能会有所不同？很抱歉，我很难理解，我用HTML、CSS和JS编写代码才两个月，我不是英国人，所以理解你答案的每一个细节都很难。你的问题问了两页，对吗？在第一页上，有几个链接。所有链接都会将用户（“导航”）发送到第二页，但第二页上显示的内容取决于单击的链接。您可以使用上面的代码来实现这一点，因为每个
链接都有一个稍微不同的
href=“”
属性，使用查询字符串。在第二页，您可以通过
window.location.search
阅读此内容。您可以使用
URLSearchParams（）
解析查询字符串。您可以“获取”查询字符串的所需部分，如上图所示。Meilleurs voeux和你的项目
let qs = window.location.search;
const urlParams = new URLSearchParams(qs);
const name = urlParams.get('name')
if (name === 'bob'){
   alert('hi bob');
}