使用 Javascript 替换包括头部在内的整个页面

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4292603/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 11:47:23  来源:igfitidea点击:

Replacing Entire Page Including Head Using Javascript

javascripthtml

提问by Joshua

I have a Javascript function that is passed a string. The string that it is passed is an entire webpage, including the header. I need the Javascript to replace the entire current page, head and all with the new content.

我有一个传递字符串的 Javascript 函数。它传递的字符串是整个网页,包括标题。我需要 Javascript 用新内容替换整个当前页面、头部和所有内容。

Consider the following HTML file:

考虑以下 HTML 文件:

<html>
  <head>
    <script language="Javascript">
      <!--
      var newContent='<html><head><script language="Javascript">function Hi() {alert("Goodbye World");}</script></head><body onload="Hi();">New Content</body></html>';
      function ReplaceContent(NC) {
        document.body.innerHTML=NC;
      }
      function Hi() {
        alert("Hello World");
        ReplaceContent(newContent);
      }
      -->
    </script>
  </head>
  <body onload="Hi();">
    Original Content
  </body>
</html>

In this case, the passed string is:

在这种情况下,传递的字符串是:

<html><head><script language="Javascript">function Hi() {alert("Goodbye World");}</script></head><body onload="Hi();">New Content</body></html>

But of course, since the "ReplaceContent" function is only replacing the body, but not the header, I never get the "Goodbye World" alert.

但是当然,由于“ReplaceContent”函数只是替换正文,而不是标题,因此我永远不会收到“再见世界”警报。

Ignoring "why I would want to do this",How can I dynamically replace the entire page, including the header, and javascript functions?

忽略“我为什么要这样做”,如何动态替换整个页面,包括页眉和 javascript 函数?

Please remember the "source" html ('newContent' above) exists only as a string, it does not exist on a server anywhere, so I cannot just redirect to it.

请记住“源”html(上面的'newContent')仅作为字符串存在,它不存在于服务器上的任何地方,所以我不能只是重定向到它。

What changes I make to "ReplaceContent" above to cause the "Goodbye World" alert to appear once the content is replaced? Please keep in mind I cannot know in advance the value of the newContent variable!!

我对上面的“ReplaceContent”进行了哪些更改以在内容被替换后显示“Goodbye World”警报? 请记住,我无法提前知道 newContent 变量的值!!

采纳答案by Dark Falcon

Use document.write.

使用 document.write。

<html>
  <head>
    <script language="Javascript">
      <!--
      var newContent='<html><head><script language="Javascript">function Hi() {alert("Goodbye World");}</script></head><body onload="Hi();">New Content</body></html>';
      function ReplaceContent(NC) {
        document.open();
        document.write(NC);
        document.close();
      }
      function Hi() {
        ReplaceContent(newContent);
      }
      -->
    </script>
  </head>
  <body>
    Original Content
    <a href="javascript:Hi()">Replace</a>
  </body>
</html>

回答by Free Consulting

Script

脚本

javascript:document.open('text/html');document.write('<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>HAI</title></head><body><h1>OMG HAI2U!!!1</h1></body></html>');document.close();

DOM snapshot of the resulting page

结果页面的 DOM 快照

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>HAI</title></head><body><h1>OMG HAI2U!!!1</h1></body></html>

回答by Robin Maben

$("html").html('your page html here');

回答by YoniXw

document.getElementsByTagName("html")[0].innerHTMLContains both headand bodytags. I Usually avoid document.open\write\close

document.getElementsByTagName("html")[0].innerHTML包含headbody标签。我通常避免document.open\write\close

回答by Ravi Prakas

var script = document.createElement('script');
script.src = 'http://code.jquery.com/jquery-1.7.2.min.js';
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);