如何在WebStorm中運行JavaScript

如果我錯過了某些顯而易見的東西，我很抱歉提前致歉，但我無法弄清楚如何在WebStorm中運行JavaScript。 WebStorm documentation表示只是在瀏覽器中打開HTML文件，但這似乎不起作用。對於它的價值，一切都在codepen.io。如何在WebStorm中運行JavaScript

這裏是HTML（一個簡單的天氣應用程序）：

<body> 
 
<head> 
 
    <script src="script.js"></script> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
    <link rel="stylesheet" href="style.css"> 
 
</head> 
 
<div class="container-fluid"> 
 
    <div class="col-sm-3"> 
 
    </div> 
 
    <div class="col-sm-6"> 
 
     <div class="white-box text-center"> 
 
      <span>Weather where you are:</span> 
 
      <div class="loc"></div> 
 
      <div class="weather"></div> 
 
      <div class="temp"></div> 
 
      <br> 
 
     </div> 
 
    </div> 
 
    <div class="col-sm-3"> 
 
    </div> 
 
</div> 
 
</body>

而這裏的腳本（仍處於草案，因爲它需要擴大，除其他事項外，鏈接到的圖像覆蓋的所有值關於 '天氣'）：

$(document).ready(function() { 
 
    $(window).on("load", function(){ 
 
     $.getJSON("http://ip-api.com/json", function(json) { 
 
      var json; 
 
      json = JSON.stringify(json); 
 
      var obj = JSON.parse(json); 
 
      var latitude = obj.lat; 
 
      var longitude = obj.lon; 
 

 
      $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat="+latitude+"&lon="+longitude+"&appid=74a6725c2ca6f1342464bb9005bf0b63", function(json) { 
 
       var json; 
 
       json = JSON.stringify(json); 
 
       var obj = JSON.parse(json); 
 
       var loc = obj.name; 
 
       var weather = obj.weather[0].description; 
 

 
       var tempInCelsius = obj.main.temp - 273.15; 
 
       var tempInCelsiusString = tempInCelsius.toFixed(1) + " &#8451"; 
 

 
       var tempInFahrenheit = obj.main.temp * 9/5 - 459.67; 
 
       var tempInFahrenheitString = tempInFahrenheit.toFixed(1) + " &#8457"; 
 

 
       var tempStringCombined = tempInCelsiusString + " | " + tempInFahrenheitString; 
 

 
       $(".loc").html(loc); 
 
       if(weather === "haze"){ 
 
        weather = "<img src='https://cdn3.iconfinder.com/data/icons/chubby-weather/440/fog-512.png'>"; 
 
       } 
 
       $(".weather").html(weather); 
 
       $(".temp").html(tempStringCombined); 
 
      }); 
 
     }); 
 
    }); 
 
});

非常感謝您的幫助！

來源

2017-02-08 Kristoffer

A 標籤周圍的HTML？ – pintxo

總是在瀏覽器控制檯中查找錯誤。注意你需要運行內部服務器，如果你使用ajax作爲安全限制在'file/open'中阻止它 – charlietfl

*「爲了什麼是值得的，一切都在codepen.io上進行。」ode pen會自動添加你的'.js '文件（以及jQuery庫）插入到HTML文件中。而在HTML中，您沒有對這些文件的引用。 WebStorm只是告訴您的瀏覽器打開該URL。瀏覽器不會奇蹟般地開始查看你想要運行的JS代碼並從某處加載它 - 你必須在你的HTML中有'）。這解決了問題。 – Kristoffer

如何在WebStorm中運行JavaScript

相關問題