为什么我的 html 只加载我的两个 javascript 脚本之一？

Question

我遇到的问题令人沮丧。我已经尝试在本地主机和代码笔中解决这个问题，但我无法弄清楚问题所在。本质上，我有两个 Javascript，一个运行一个新闻提要，一个运行用于 DOW 的自动收报机磁带。但是，它们不会同时运行。任何帮助将不胜感激。

注意：这一切都是建立在 bootstrap CSS.

<head>
<meta charset="utf-8" content="width=device-width initial-scale=1">
<title>Predictive Trades</title>
<link rel="stylesheet" href="{% static 'css/style.css' %}">
<link rel="stylesheet" href="{% static 'css/fixed.css' %}">
<link rel="stylesheet" href="{% static 'css/bootstrap.css' %}">
</head>

<body>
<!--- Start Landing Page Section --->
<div class="landing">
  <div class="home-wrap">
    <div class="home-inner">
    </div>
  </div>
</div>
<div class="caption text-center">
  <h1>Advanced Market Analytics</h1>
  <h3>Enter Company Below to get Started</h3>
  <div class="container h-100">
      <div class="d-flex justify-content-center h-100">
        <div class="searchbar">
          <input class="search_input" type="text" name="" placeholder="Search...">
          <a href="#" class="search_icon"><i class="fas fa-search"></i></a>
        </div>
      </div>
    </div>
</div>
<div intrinio-widget-type="ticker_tape" intrinio-widget-tickers="DOW30">
  <script>
  (function(f,i,n,t,e,c,h){f['IntrinioWidgetsObject']=e;f[e]=f[e]||function(){
       (f[e].q=f[e].q||[]).push(arguments)},f[e].l=1*new Date();c=i.createElement(n),
       h=i.getElementsByTagName(n)[0];c.async=1;c.src=t;h.parentNode.insertBefore(c,h)
       })(window,document,'script','https://widget-api-cdn.intrinio.com/intrinio-widgets.min.js','iw');
       iw('initialize', {userId: '2095ee9f024bec258d15150a90bbe843bdd1271613906cd7b5125229f23d654b'})
  </script>
</div>
<!--- End Landing Page Section --->
</div>
<!--- End Home Section --->

<!--- Start Market Section --->
<div id="market" class="offset">
  <div class="col-12">
    <h1 class="heading">Today's Highlights</h1>
  </div>
  <div class="jumbotron">
    <div class="narrow">
    </div>

  </div>
</div><!--- End narrow --->

</div><!--- End jumbotron --->
     <div id=news class="text-white-50">
     <script>
          window.onload= function() {
            news();
          }
          function news() {
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
              if (this.readyState == 4 && this.status == 200) {
                document.getElementById("news").innerHTML =
                this.responseText;
              }
            };
            xhttp.open("GET", "https://cloud.iexapis.com/stable/stock/spy/news/last/5?token=tpk_6925213461cb489b8c04a632e18c25dd", false);
            xhttp.send();
          }
       </script>
    </div>
</div><!--- End Market Section --->

<script type="text/javascript" src="js/news.js"></script>
<script src="js/jquery-3.4.1.min.js"></script>
<script src='js/bootstrap.js'></script>
<script src="https://use.fontawesome.com/releases/v5.5.0/js/all.js"></script>
<!--- End Script Source Files --->
</body>

Answer 1

使用它加载您的新闻。你在哪里使用 window.onload 我猜你的其他功能阻止了 window 被完全加载，这样它会在 dom 准备好后立即触发。

     <div id=news class="text-white-50">
       <script>
document.onreadystatechange = function(e)
{
    if (document.readyState === 'complete')
    {
        news();
    }
}; 
       </script>
    </div>

您可以在此处找到更多信息： How to execute code before window.load and after DOM has been loaded?

为什么我的 html 只加载我的两个 javascript 脚本之一？

Why is my html only loading one of my two javascript scripts?

html

javascript

css

jquery

dom-events