在div中加载其他html文件不会使用当前文件的CSS(Loading other html file within a div doesn't use the CSS of current file)

 我有这样的代码： 
 
  <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>
 
 “ 
 
 它工作正常，但当我在“内容”中加载其他html文件时，该文件不使用index.html中包含的css等 
 
 这是包含的代码： 
 
  <script>
  function load_purchase() {
     document.getElementById("content").innerHTML='<object type="text/html" data="purchase.html" ></object>';
    }
  </script>
 
 这是“purchase.html”： 
 
  <div class="container">
  <div class="col-md-12"><a href="#" class="btn btn-primary btn-block text-center text-uppercase" data-toggle="">Test</a></div>
  </div>
 
 它不使用css文件，因此它只显示没有任何样式的文本“Test”。 
 
 我究竟做错了什么？ 

I have a code like this:
 
  <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>
 
'
 
and it works properly, but when I load other html file in the "content", the file doesn't use the css etc. included in index.html
 
Here's the including code:
 
  <script>
  function load_purchase() {
     document.getElementById("content").innerHTML='<object type="text/html" data="purchase.html" ></object>';
    }
  </script>
 
and this is the "purchase.html":
 
  <div class="container">
  <div class="col-md-12"><a href="#" class="btn btn-primary btn-block text-center text-uppercase" data-toggle="">Test</a></div>
  </div>
 
It doesn't use the css file, so it's just showing text "Test" without any styles.
 
What am I doing wrong?

原文：https://stackoverflow.com/questions/43846022