这个URL修改怎么可能？

Question

有人可以告诉我们网站http://www.outsharked.com/imagemapster/default.aspx?what.html是如何运作的吗？在不加载/重新加载页面的情况下修改URL。我认为这不是由html5完成的。因为它适用于不支持html5的IE6。

Answer 1

我创建了该网站。评论者是正确的，它使用Javascript来更改URL。关于IE6的导航工作方式没有任何意义 - 浏览器支持必要的客户端功能来执行此类操作。基本功能包括：

1. 捕获导航上的点击事件，并通过AJAX加载内部内容
2. 更新网址以反映目标的工作直接网址。

链接也是有效的锚链接，在没有Javascript的情况下，会转到同一页面（但加载整个内容）。这是您的基本AJAX网站设置，只有一个细微差别。通常的做法是在AJAX /单页网站中使用这样的URL：

http://mysite.com/home#somepage

甚至只是

http://mysite.com/#somepage

标签部分表示用户导航到的实际页面。如果有人直接访问该网址，例如从网站外部开始，网站将在页面加载后使用Javascript根据主题标签加载正确的内容。这意味着内部内容可能会有一点延迟反映正确的页面，因为在从浏览器加载初始页面以通过AJAX获取内部内容后，它必须运行另一个请求。

我试图通过创建一个完全使用和不使用Javascript的设置来避免这种情况。如果您直接转到网站中的网址，例如http://www.outsharked.com/imagemapster/default.aspx?faq.html，您会发现它会直接加载内容。即使禁用了Javascript，此URL也会起作用。您实际上无法使用主题标签执行此操作，因为主题标签内容不会发送到服务器。只有客户端知道URL中的＃标签后面是什么。这就是我使用查询字符串来表示内页的原因。

这个网站架构当时是一种实验。它工作得很好，但代码并不是很棒，我没有用它做任何其他事情，我确信还有其他更好的充实/测试/功能齐全的框架在那里做同样的事情事情。

但它可能不是创建基本AJAX导航设置的基本要素，作为一种学习工具，因为它非常简洁，并且还有HTML5历史导航（例如，后退按钮适用于现代浏览器）。