无法链接 <span> 标记中的文本答案

【问题标题】：Can't link text in <span> tag无法链接 <span> 标记中的文本
【发布时间】：2022-01-30 05:21:27
【问题描述】：

我有一个由 span 元素组成的导航模板。我想将 URL 添加到它在新选项卡中打开某个 URL 的 span 元素之一。我究竟做错了什么？（我是编程初学者）

<Tab>
  <img className="svg" src="/assets/img/svg/briefcase.svg" alt="briefcase" />
  <span href="url.html" className="menu_content">eindrücke</span>
</Tab>

【问题讨论】：

你为什么使用一个没有（似乎）做你想做的事情的 React 模板；你能修改它，创建锚<a> 而不是<span> 元素吗？

标签： html reactjs

【解决方案1】：

Span 用于显示文本。

如果要添加链接，需要添加锚元素<a>。

你需要写：

<a href='YOUR_LINK'>text_of_your_link</a>

而不是：

<span>your_text</span>

您可以使用 <a> 链接到其他 url 或 HTML 中的 id。

如果您想链接到您编写的同一页面中的 id：

<a href='#YOUR_ID'>your_text</a>

然后页面将滚动到页面中的那个 id。

如果你想要一个链接到一个页面并直接滚动到一个id，你的写法：

<a href='https://yourlinkurl.com/#THE_ID'>your_text</a>

如果您想在您的 React 应用程序中添加导航，并向您的 React 应用程序的页面添加不同的 URL，您将需要添加一个库（如 React 路由器）。

在该库中，您拥有将用于在应用内部导航的自定义组件。它们是这样使用的：

<Link to='/your_local_url'>your_text</Link>

https://reactrouter.com

【讨论】：

谢谢兄弟。看来我需要花更多时间在这个话题上：D