如何访问在另一个 html 文件中声明的对象？

Question

我正在导入使用 qgis2web 在 <iframe> 中创建的地图。

 <iframe id="leaflet"
         src="/qgis/index.html"
         scrolling="no"
         frameborder="0"
         style="height: 100vh;width: 100%">
 </iframe>

我需要访问在 /qgis/index.html 文件内的 <script> 中声明的对象（地图）并修改它的一些属性。

我可以直接在 /qgis/index.html 文件中进行操作，但是因为这个文件夹是从另一个软件导出的，并且会经常被修改，我想在主文件中编写所有这些代码 index.html 文件，其中地图被导入到<iframe>

/qgis/index.html文件中的对象：

   <script>
   ...
   var map = L.map('map', {zoomControl:true, maxZoom:18, minZoom:15});
   ...
   </script>

...以及我想在 index.html 主文件中执行的修改：

    <script>
    var lat = -0.017;
    var lng = 0.015;
    var zoom = 16;

    map.setView([lat, lng], zoom);
    </script>

我尝试通过document.getElementById('map'); 进行操作，但没有成功。

编辑 1

我尝试了什么（不成功）

index.html：

<script>
  var lat = -0.017;
  var lng = 0.015;
  var zoom = 16;

  var map = document.getElementById("leaflet").contentWindow.map;
  map.setView([lat, lng], zoom);

EDIT 2工作，但 iframe 加载进入循环并无限期加载自身

index.html

<iframe id = 'iframeid'
    src="/qgis/index.html"
    scrolling="no"
    frameborder="0"
    style="height: 100vh;width: 100%"
    onload="on_load(this)">
</iframe>
...
<script type="text/javascript">

  function on_load(iframe) {
  try {
    var lat = -0.017;
    var lng = 0.015;
    var zoom = 16;

    var map = document.getElementById("iframeid").contentWindow.map;

    map.setView([lat, lng], zoom);
  } catch (e) {
    // This can happen if the src of the iframe is
    // on another domain
    alert('exception: ' + e);
  }
}
  </script>

Answer 1

可能与this问题有关。

如果是，你应该试试var map = document.getElementById("iframeid").contentWindow.map;

编辑

我已经尝试过了，对我来说也是一样。 我发现在访问 iframe 中的变量之前我需要一点时间等待，因为当调用 javascript 时 iframe 尚未加载。

在我的超级简单示例中，我使用了 setTimeout 函数：(setTimeout(function(){alert(document.getElementById('iframe').contentWindow.text)}, 5000);)，但最好的解决方案是定义一个 onLoad 事件，例如 this one

Answer 2

为什么不放弃 iframe 而使用 qgis2web 模板呢？