锚标签中哈希（#）后的文件夹是什么意思？答案

【问题标题】：What is the meaning of folder after hash(#) in the anchor tag?锚标签中哈希（#）后的文件夹是什么意思？
【发布时间】：2016-11-20 23:43:52
【问题描述】：

在this angular tutorial 的组件模板部分，他们使用以下代码：

...
<ul class="phones">
  <li ng-repeat="phone in $ctrl.phones | filter:$ctrl.query | orderBy:$ctrl.orderProp" class="thumbnail">
    <a href="#/phones/{{phone.id}}" class="thumb">
      <img ng-src="{{phone.imageUrl}}" alt="{{phone.name}}" />
    </a>
    <a href="#/phones/{{phone.id}}">{{phone.name}}</a>
    <p>{{phone.snippet}}</p>
  </li>
</ul>
...

在锚标记中，他们使用以下值作为 href "#/phones/{{phone.id}}"。据我所知href="#" 会在点击时跳转到页面顶部。 href="#mydiv" 会跳转到 id 为 mydiv 的元素。

我从未见过像href="#/folder1/myimg.jpg" 这样的东西。是否等同于href="/folder1/myimg.jpg"？

【问题讨论】：

URL 的哈希组件不符合发送到服务器的条件，因此其更改不会影响页面重新加载。 Angular 使用这一事实来构建其 SPA 框架。

标签： javascript html angularjs href

【解决方案1】：

将“#”符号作为某个东西的 href 意味着它不是指向不同的 URL，而是指向同一页面上的另一个 ID 或名称标签。例如：

<a href="#bottomOfPage">Click to go to the bottom of the page</a>
blah blah
blah blah
...
<a id="bottomOfPage"></a>

但是，如果没有 id 或 name，那么它就会“无处可去”。

有关更多信息，您可以查看... What is href="#" and why is it used?

但在 angularJS 中，它用于路由请求……因为 angularJS 为构建的Single Page Application 提供了很好的支持……# 后面的参数用于查找要渲染的正确页面……

这是一个不错的example .. 但您需要时间来深入了解它..

【讨论】：

【解决方案2】：

似乎所有锚事件都会被javascript中断，并且页面可能会使用ajax在后台加载，并且浏览器的地址行会改变，但不会导致浏览器重新加载页面。在 HTML4 中，它无法在不重新加载页面的情况下更改地址行。所以这是一种解决方法：

指定js应该加载哪个页面。
让用户能够在未来参考或分享特定页面。

【讨论】：