Javascript 我可以在不更新页面的情况下更改URL吗？

这似乎是个愚蠢的问题。但我不知道是否能做到。因此，在我开始制作一个投资组合网站的过程之前，我想要一些提示。否则，我将采用另一种设计

我的问题：

使用ascencor.js插件时，我网站上的所有内容都在一个文件中。我永远不会去一个新的url，比如/contact或/about

但后来我想知道，谷歌呢

我的所有内容都将放在不同的类中，但放在同一个文件中：

<div class="floor floor-1">
    <span class="text">Floor 1</span>
</div>
<div class="floor floor-2">
    <span class="text">Floor 2</span>
</div>

一楼
二楼

检查此处的示例：

所以，是的，使用这种方法，我永远不会更改url，所以我只能索引一个页面

有没有一种方法可以在不更新网站的情况下更改URL？例如，我能去吗

如果不可能，我是否可以在每次单击新“页面”时至少覆盖页面标题。以一些PhP为例

---

或者我应该采取完全不同的方法吗？：）

可以使用散列链接来完成，散列链接最初设计为跳转到页面上的某个div，现在通常用于在单个页面上加载动态页面

因此，您可以链接到

http://rplambech.dk/ascencor/index.html#floor5

例如

然后使用一些javascript，比如

var loc = location.hash.split("#")[1];

然后

     if(loc == 'floor5'){
         //execute goto floor 5 code
      }

---

如前所述，使用HTML5的

history.pushState

var stateObj={foo:“bar”}；
函数更改\u我的\u url（）
{
pushState（stateObj，“第2页”，“bar.html”）；
}
var link=document.getElementById（'click'）；
link.addEventListener（'click'，change\u my\u url，false）；

网址：

---

根据问题的上下文及其注释，您正在寻找术语单页应用程序

执行此操作的方法有很多，其中一些方法利用历史对象来支持浏览器的“后退”和“前进”按钮

我建议您搜索术语“单页应用程序”，同时检查以下一些（或全部）框架（它们将简化您的开发，使您的生活更轻松，而不是处理

和讨厌的低级ajax调用：

backbone.js

安格拉斯

ember.js

---

不，如果不转到服务器，则无法更改URL

但是JQuery确实有一个很酷的页面加载器来加载页面。 如果不刷新页面，则无法将url“/ascencor”更改为“/ascensor/floor5”

---

但您可以更改为“/assensor/#floor5”（添加了哈希符号）。我建议您尝试获取更多信息。

您要归档的内容是什么？您想将其他页面的内容加载到

DIV

中，还是想从页面重定向到另一个页面，还是想调整URL（浏览器历史记录）你的网站？我想在我的DIV中加载我页面的内容，并调整URL。没有重定向。你可以尝试添加锚数据。假设你的URL是“example.com/foo.html”，你可以将其更改为“example.com/foo.html#foo5”，它不会触发页面加载。你可以在加载时检查URL并显示“foo5”的内容在你的网站上。你可以使用人们在这里提出的所有好建议（使用#和许多if语句）。但是在你重新发明轮子之前，先搜索“单页应用程序”一词看看那些能让你的生活更轻松的js库历史API呢？history.pushState不支持IE和Android，所以我投js的票。我不会说你不能这么做，因为history.pushState（stateObj，“page 2”，“bar.html”）；我必须试试这个。

<script type="text/javascript">
var stateObj = { foo: "bar" };
function change_my_url()
{
   history.pushState(stateObj, "page 2", "bar.html");
}
var link = document.getElementById('click');
link.addEventListener('click', change_my_url, false);
</script>

<a href="#" id='click'>Click to change url to bar.html</a>