Как запустить JavaScript в WebStorm

Я новичок в этом, так что извиняюсь заранее, если мне не хватает чего-то очевидного, но я не могу понять, как запустить JavaScript в WebStorm. WebStorm documentation говорит просто открыть HTML-файл в браузере, но это, похоже, не работает. Для чего это стоит, все работает на codepen.io.Как запустить JavaScript в WebStorm

Вот 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, который вы пытаетесь запустить, и загружать его откуда-то - для этого вам нужно иметь теги «). Это поставило проблему. – Kristoffer

Смежные вопросы