Question

我有一个传递字符串的Javascript函数。传递的字符串是整个网页，包括标题。我需要使用Javascript来替换整个当前页面，使用新内容替换所有页面。

考虑以下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>

在这种情况下，传递的字符串是：

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

但是，当然，由于“ReplaceContent”功能只是取代了身体，而不是标题，我从未得到“再见世界”的警告。

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

请记住“source”html（上面的'newContent'）仅作为字符串存在，它在任何地方的服务器上都不存在，所以我不能只重定向到它。

我对上面的“ReplaceContent”进行了哪些更改，以便在替换内容后出现“Goodbye World”警报？ 请记住，我事先无法知道newContent变量的值!!

请注意：涉及“你为什么要这样做”的答案将被低估。

Answer 1

使用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>

Answer 2

脚本

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快照

<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>

Answer 3

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

Answer 4

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);

Answer 5

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" style="@style/CardView.Light" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:layout_marginStart="8dp" android:layout_marginEnd="8dp" android:focusable="false" android:focusableInTouchMode="false" tools:context=".JobsActivity" tools:ignore="ContentDescription"> <android.support.constraint.ConstraintLayout xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="wrap_content"> <TextView android:id="@+id/customer_name" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginTop="24dp" android:layout_marginStart="16dp" android:layout_marginEnd="16dp" android:text="@string/customer_name" android:textAppearance="@style/TextAppearance.AppCompat.Headline" android:textColor="@color/colorPrimaryTextDefaultMaterialLight" app:layout_constraintTop_toTopOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@+id/customer_mobile_image" /> <TextView android:id="@+id/mobile_model" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginStart="16dp" android:layout_marginEnd="16dp" android:text="@string/mobile_model" android:textAppearance="@style/TextAppearance.AppCompat.Body1" android:textColor="@color/colorSecondaryTextDefaultMaterialLight" app:layout_constraintTop_toBottomOf="@+id/customer_name" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toStartOf="@+id/customer_mobile_image" /> <ImageView android:id="@+id/customer_mobile_image" android:layout_width="120dp" android:layout_height="120dp" android:layout_marginEnd="16dp" android:layout_marginTop="16dp" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" app:srcCompat="@android:color/darker_gray" /> <Button style="@style/Widget.AppCompat.Button.Borderless" android:id="@+id/action_button_1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginStart="8dp" android:minWidth="0dp" android:paddingStart="8dp" android:paddingEnd="8dp" android:text="@string/show_location" android:textColor="@color/colorPrimaryTextDefaultMaterialLight" app:layout_constraintTop_toBottomOf="@+id/customer_mobile_image" app:layout_constraintStart_toStartOf="parent" app:layout_constraintBottom_toBottomOf="parent" android:focusable="false" android:focusableInTouchMode="false" /> <Button style="@style/Widget.AppCompat.Button.Borderless" android:id="@+id/btnOpen_pickup" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginStart="8dp" android:minWidth="0dp" android:paddingStart="8dp" android:paddingEnd="8dp" android:text="@string/open_job" android:textColor="@color/colorPrimaryTextDefaultMaterialLight" app:layout_constraintTop_toTopOf="@+id/action_button_1" app:layout_constraintStart_toEndOf="@+id/action_button_1" /> </android.support.constraint.ConstraintLayout> </android.support.v7.widget.CardView>同时包含document.getElementsByTagName("html")[0].innerHTML和head标签。我通常避免使用body

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

5 个答案:

脚本

结果页面的DOM快照