Question

这是一个技术问题，我试图在浏览器中更深入地了解javascript。

所以场景是page1上唯一的东西是一个链接，可能还有一些JS：

<script>something</script>
<a href="/page2.php">link</a>

当点击第2页链接时，是否可以将某些javascript“转移”到第2页，以便JS可以在第2页上运行，而不会在标记中包含任何原始文件？

我以为你可以这样做：

<a onClick="loadXMLDoc();" href="/page2.php">link</a>

loadXMLDoc功能摘录：

var xmlhttp;
xmlhttp=new XMLHttpRequest();

xmlhttp.onreadystatechange=function()
      {

window.location = "/page2.php";

if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
alert('worked');

}
...
xmlhttp.open("POST","/responsedelay.php",true);
...

这个想法是向一个单独的页面发出一个ajax请求，在它上面有一个计时器（在php中），并在几秒钟后（比如说10）给出一个响应。到那时，新页面已经加载，我们希望仍然可以访问当前窗口DOM的javascript。 ALAS，这不起作用，并不太令人惊讶，仍然试图跳出框框思考！有什么想法吗？

我猜测唯一的方法是在page1的上下文中打开page2（即将第2页元素添加到第1页），但也许有一种我不知道的新方式！

Answer 1

https://html.spec.whatwg.org/multipage/browsers.html#browsing-context很好地解释了基本概念。

每当您通过地址栏加载页面时，通过操纵当前页面的unique location object来加载iframe或您提到的内容。浏览环境。

简化：如果您更改了位置，您的当前页面DOM将被丢弃（技术上已取消引用，因此可以在大多数引擎中进行垃圾收集）并替换为从新位置构建的DOM。

但是，您可以保留上下文和window，但切换DOM的部分内容，这几乎是window下的所有内容。

评论中提到的Turbolinks完全相同：保留window对象和上下文，但替换文档body。

现代浏览器让你以编程方式改变一切：

当前页面的标题。
浏览器URL输入字段的内容。
浏览器的历史记录，所以即使是后退/前进按钮等工作（Mark Pilgrim也写了great piece on this，应该进一步澄清。）

简而言之，您可以保留相同的页面，但对于用户来说，感觉就像他们会浏览一下。 YouTube就是一个很好的例子：当您从视频中浏览视频时，会保留window，但body，标题部分，浏览器网址和标题等都已更改。

YouTube的优势在于，他们不必为您访问的每个视频重新加载各种视频解码器库等，而是在您初次访问时执行此操作。

缺点是你必须真正了解你正在做什么，因为错误很快就会复杂，你很容易打破必要的用户流程（后退按钮等）。

在浏览器javascript中是否存在持久性DOM这样的事情？

1 个答案: