Javascript 重新加载页面的一部分_Javascript_Php_Html_.htaccess_Reload

Javascript 重新加载页面的一部分

javascript php html .htaccess

Javascript 重新加载页面的一部分,javascript,php,html,.htaccess,reload,Javascript,Php,Html,.htaccess,Reload,请帮帮我你能告诉我如何用更改URL来重新加载页面的部分，但它必须不包含哈希标记一些代码： URL:mysite.com/first/ <html> <body> <h1>RELOAD!</h1> <div>few words...</div> <input type="button"> <body> </html> <html> <body>

请帮帮我

你能告诉我如何用更改URL来重新加载页面的部分，但它必须不包含哈希标记
一些代码：
URL:mysite.com/first/

<html> <body> <h1>RELOAD!</h1> <div>few words...</div> <input type="button"> <body> </html>

<html> <body> <h1>RELOAD!</h1> <div>other few words...</div> <input type="button"> <body> </html>
但是-它会重新加载所有页面
.htaccess-我无法使用，因为char“#”和下一个文本不会发送到服务器

我还看到了代码：

history.pushState(null, null, '#myhash'); if(history.pushState) { history.pushState(null, null, '#myhash'); } else { location.hash = '#myhash'; }
但我不能正确理解它

也许还有其他正确的方法。这里实际上有两个不同的问题：

如何从服务器加载内容并在现有页面中显示，而无需重新加载整个页面

如何让它看起来像你在一个新的URL上，而不重新加载页面
这两个模块都与
.htaccess
（通常指Apache的
mod_rewrite
模块）无关，因为它们都是关于客户端的行为，而不是服务器
第一部分通常被称为“AJAX”，关于它，您可以在网上找到大量信息。“X”最初代表“XML”，但实际上，您可以获取任何类型的数据，例如纯文本或一段现成的HTML，并使用JavaScript将其放置在页面上。流行的jQuery库具有，它向服务器发出请求，并使用响应替换页面的特定部分
第二部分有点棘手-因为页面实际上没有被重新加载，所以您基本上希望浏览器对当前URL撒谎。在
之后，您会看到许多示例仅更改URL的一部分，这正是因为这些URL没有发送到服务器；传统上，它们用于将当前页面滚动到特定的“锚点”。因此，您可以随时更改它们，如果用户为您的页面添加书签或共享页面，您可以查看
#
后面的部分，然后重新加载它们添加书签/共享的状态
然而，作为“HTML5”技术组的一部分，添加了一种功能，可以通过将状态“推送到
历史
对象来更改浏览器的实际URL栏。换句话说，在浏览器的后退/前进菜单中添加条目，而不实际加载新页面。有明显的安全限制（不能假装用户导航到完全不同的域），但API本身非常简单
对于您的简单示例，假设已包含jQuery，您可以执行以下操作：

// Find the div with a jQuery selector; this would be more specific in reality jQuery('div') // Request some text from the server to replace the div .load( // This URL can be anything that generates the appropriate HTML '/ajax.php?mode=div-content&stage=second', // Add a callback function for when the AJAX call has finished function(responseText, textStatus, XMLHttpRequest) { // Inside the callback function, set the browser's URL bar // and history to pretend this is a new page history.pushState({}, '', '/second/'); } );

请注意，jQuery远非唯一的实现方法，它只是使示例保持简单，以利用为我们做了大量工作的现有函数。
no。别无选择
pushState
就是这样做的。最好开始理解它。：）文档不属于术语pushState，它实际上是历史对象的一部分。好吧，谢谢你。。。但是时间呢。。。如果我的数据将刷新，并以现金形式保存旧版本-我将始终获得旧数据？还是什么？@serge我不知道你的意思。如果用户点击“刷新”，他们的浏览器应该在地址栏中加载URL，这将是您的“第二”页，并且可以适当地呈现内容。AJAX请求也可以根据您设置的HTTP缓存头进行缓存（与任何其他页面或资源一样）({page:@serge我猜你试图在那条评论中添加新行。如果你这样做，你的文本就会被吃掉…：|对不起，我昨天上网有问题。如果我写-history.pushState（{page:“http://mysite.com/first”，键入：“page”}，document.title，“http://mysite.com/first”）；然后重新加载我的电脑，我会有这个缓存吗？
// Find the div with a jQuery selector; this would be more specific in reality jQuery('div') // Request some text from the server to replace the div .load( // This URL can be anything that generates the appropriate HTML '/ajax.php?mode=div-content&stage=second', // Add a callback function for when the AJAX call has finished function(responseText, textStatus, XMLHttpRequest) { // Inside the callback function, set the browser's URL bar // and history to pretend this is a new page history.pushState({}, '', '/second/'); } );