时间戳

首页 > 解决方案 > 如何将javascript文件导入另一个javascript文件

javascript - 如何将javascript文件导入另一个javascript文件

问题描述

我正在根据我想要的一些 json 数据开发一个计算器，当我输入经度和纬度时，我会得到与该经度和纬度相关联的网格代码，因为你会看到我想将 ghiData.js 文件添加到 script.js 文件中是我的 json 数据的样子

   myData = {
    "datagrid": [
      { "GRIDCODE": 1735, "lat": 35.91511132, "long": -5.401484264 },
      { "GRIDCODE": 1805, "lat": 35.90677815, "long": -5.468149593 },
      { "GRIDCODE": 1808, "lat": 35.90677815, "long": -5.459816427 },
      { "GRIDCODE": 1784, "lat": 35.89844499, "long": -5.476482759 }
    ]
  };

这是我的代码：

function lookupGridcodeByLatAndLong(lat, long){
let gridcode = 0;

var result = myData.datagrid.find(x => x.lat == lat && x.long == long)
if (result) {
  gridcode = result.GRIDCODE;
}

return gridcode;
}
$("#Btn" ).click(function() {
var lat = document.getElementById("lat").value,
long = document.getElementById("long").value;
var result = lookupGridcodeByLatAndLong(lat, long)
$("#result").html(result);
});
<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>CodePen - Exercise 2D - jQuery Rounding Calculator Complete</title>
  <link rel="stylesheet" href="./style.css">

</head>
<body>
<!-- partial:index.partial.html -->
<h1 id="result">Rounding Calculator</h1>

<form action="" id="my-form">
  <div class="form-group">
    <label for="">Enter Lat</label>
    <input type="text" id="lat" step="any">
    <label for="">Enter Long</label>
    <input type="textr" id="long" step="any">

  </div>
  <input type="button" id="Btn" value="Calculate" >
</form>
<!-- partial -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

  <!-- ghiData.js is my data file -->
  <script  src="./ghiData.js"></script>
  <script  src="./script.js"></script>

</body>
</html>

标签： javascriptjqueryjsonimport

解决方案

尝试使用 JavaScript 导入文件，使用importandexport关键字。所以在script.js你应该打电话import { MyData } from './ghiData.js'和ghiData.js你应该使用export myData. 我希望它有效！

推荐阅读