Javascript 在div中加载其他html文件不会'；不要使用当前文件的CSS

我有这样一个代码：

  <div class="bg-faded text-center p-1 h-50" id="content">
  <div class="container">
  <div class="row py-4 my-2">
    <div class="col-md-3">
      <h3 class="">Simplicity</h3>
      <p class="lead">Just set the bot up and run it, the rest will be done for you!</p>
    </div>
    <div class="col-md-3">
      <h3 class="">No risk of ban</h3>
      <p class="lead">The bot doesn't use any kind of injection, thus the chances of getting banned are almost non-existent!<br></p>
    </div>
    <div class="col-md-3">
      <h3 class="">Time</h3>
      <p class="lead">A single bot takes about a week to get the account to level 30!</p>
    </div>
    <div class="col-md-3">
      <h3 class="">Limitless</h3>
      <p class="lead">You can run as many bots as you want!</p>
    </div>
  </div>
  <div class="row">
    <div class="col-md-3">
      <h3 class="">Performance</h3>
      <p class="lead">The bot itself uses about 20 MB RAM, so it doesn't overload your computer!</p>
    </div>
    <div class="col-md-3">
      <h3 class="">Updates</h3>
      <p class="lead">The application is gets constantly updated, thus works with the latest patches!</p>
    </div>
    <div class="col-md-3">
      <h3 class="">Resolutions</h3>
      <p class="lead">It works on every single resolution higher than 1024x546!</p>
    </div>
    <div class="col-md-3">
      <h3 class="">Regions support</h3>
      <p class="lead">It supports every single region, all you need to do is changing the language to English!</p>
    </div>
  </div>
  <div class="col-md-12"><a href="#" class="btn btn-primary btn-block text-center text-uppercase" data-toggle="">Purchase now!</a></div>
  </div>

简单
只需设置机器人并运行它，其余的工作将为您完成
没有被禁止的风险
机器人不使用任何类型的注射，因此被禁止的机会几乎不存在

时间
单个机器人大约需要一周时间才能将帐户升级到30级
无限的
您可以运行任意数量的机器人程序
演出
机器人本身使用大约20 MB的RAM，因此不会使您的计算机过载
更新
应用程序会不断更新，因此可以使用最新的修补程序
决议
它适用于高于1024x546的每个分辨率
区域支持
它支持每个地区，您只需将语言更改为英语即可

"

它工作正常，但当我在“content”中加载其他html文件时，该文件不使用index.html中包含的css等

以下是包含的代码：

  <script>
  function load_purchase() {
     document.getElementById("content").innerHTML='<object type="text/html" data="purchase.html" ></object>';
    }
  </script>

函数加载_购买（）{
document.getElementById（“内容”）.innerHTML=''；
}

这是“purchase.html”：

它不使用css文件，所以它只是显示文本“Test”，没有任何样式

我做错了什么？

元素就像

iframe

，它们不会从父元素继承样式或类似内容

如果希望

purchase.html

成为文档的一部分，包括通过其样式表进行样式设置等，则需要通过ajax加载它，然后将html直接分配给

#content

上的

innerHTML

例如，大致：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
        document.getElementById("content").innerHTML = xhr.responseText;
    }
};
xhr.open("GET", "purchase.html");

很抱歉，因为您没有在代码中使用jQuery，所以直到后来看到标记，我才意识到您正在使用jQuery。jQuery为此提供了一个函数，如下所示：

---

可以使用jQuery

.load（）

函数代替

对象

$("#content").load("purchase.html");

---

有关详细信息，您可以查看Downvoter:注意问题上有一个

jquery

标记。（这可能不是你投否决票的原因，但如果是…）我尝试过使用它，但出于某种原因我根本无法让它工作。@P Sawicki如果你没有使用

jQuery

，那么从你的问题中删除

jQuery

标记，我们将为你提供正确的解决方案。请先包含

jQuery

库，然后使用此代码。它肯定会起作用。code.jquery.com/jquery-3.1.1.slim.min.js“>检查您的开发人员选项是否有任何错误，我认为您为jquery编写了错误的路径应该是

是的，我尝试使用jquery加载，但根本不起作用我不知道why@PSawicki：好的，您不必使用jQuery如果这是您使用它的唯一原因，请参阅我的第一个代码块（大致）直接使用DOM也是一样。谢谢你的代码，但是我想使用jQuery，因为它看起来更简单。但是，它不起作用，你知道为什么吗？下面是代码：我做错什么了吗？@PSawicki:是：jquery路径中有不可见的字符（在

jquery.min.js

部分，删除所有字符，然后再次键入）。在web控制台中查看，错误将显示出来。（当事情不起作用时，web控制台是第一个可以查看的地方。）如果您修复了路径，那么代码就会起作用。什么是web控制台？

$("#content").load("purchase.html");

$("#content").load("purchase.html");