我们如何更新url或查询string使用JavaScript / jQuery,而无需重新加载页面?

有没有办法更新url编程方式而不重新加载页面?

编辑:我在post中添加了一些标题。我只是想清楚,我不想重新加载页面

是的 – document.location = "http://my.new.url.com"

你也可以用同样的方法检索它。

 var myURL = document.location; document.location = myURL + "?a=parameter"; 

位置对象也有一些有用的属性:

 hash Returns the anchor portion of a URL host Returns the hostname and port of a URL hostname Returns the hostname of a URL href Returns the entire URL pathname Returns the path name of a URL port Returns the port number the server uses for a URL protocol Returns the protocol of a URL search Returns the query portion of a URL 

编辑:设置document.location的哈希不应该重新加载页面,只是改变焦点在页面上的位置。 所以更新到#myId将滚动到id="myId"的元素。 如果id不存在,我相信什么都不会发生? (虽然需要在各种浏览器上确认)

编辑2:要清楚,不只是在一个评论:你不能更新整个url与JavaScript而不更改页面,这是一个安全限制。 否则,您可以点击一个随机页面的链接,制作成gmail的样子,并立即将URL更改为www.gmail.com并窃取用户的login信息。
您可以在某些浏览器上更改域名之后的部分来处理AJAX风格的内容,但这已经与Osiris相关联。 更重要的是,即使可以,你也可能不应该这样做。 该url告诉用户他/她在您的网站上。 如果在不更改页面内容的情况下更改它,则会变得有点混乱。

是和不是。 所有常见的Web浏览器都有一个安全措施来防止这种情况发生。 目标是防止人们创build网站副本,更改url使其看起来正确,然后欺骗人们并获取他们的信息。

但是,一些与HTML5兼容的浏览器已经实现了一个历史loggingAPI,可以用于类似于你想要的东西:

 if (history.pushState) { var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?myNewUrlQuery=1'; window.history.pushState({path:newurl},'',newurl); } 

我testing过了,它运行良好。 它不会重新加载页面,但它只允许您更改URL查询。 您将无法更改协议或主机值。

了解更多信息:

http://diveintohtml5.info/history.html

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

您可以使用 :

 window.history.pushState('obj', 'newtitle', newUrlWithQueryString) 

document.location是正常的方法。

然而,document.location与window.location实际上是一样的,除了window.location在老版本的浏览器中更受支持,所以可能是最好的select。

看看这个线程上的SO了解更多信息:

在JavaScript中的window.location和document.location之间有什么区别?

普通的javascript:document.location ='http://www.google.com';

这会导致浏览器刷新,但如果您需要更新URL以实现某种浏览历史logging而不重新加载页面,请考虑使用哈希值。 如果是这种情况,您可能需要查看jQuery.hashchange。

你需要更具体。 “更新url”是什么意思? 这可能意味着自动导航到不同的页面,这当然是可能的。

如果您只想更新地址栏的内容而不重新加载页面,请参阅修改URL而不重新加载页面

前缀URL使用标签进行更改,以避免redirect。

这redirect

 location.href += '&test='true'; 

这不redirect

 location.href += '#&test='true'; 

是的 – 查询的document.location.hash