首页 > 解决方案 > 访问先前由另一个 html 文件填充的对象

问题描述

我有 2 个文件 html(index.html 和 event.html)。

在我的文件中的 index.html 中,我导入了一个 JS:

<script type="text/javascript" src="../js/events/createEventOBJ.js"></script>

这是我的带有填充对象的 js 示例(事实上,使用 console.log 我可以看到我的 newObj):

var newObj = [];

function getOBJ(eventObj){
    newObj = eventObj;
    console.log(newObj);
}

function createObj(){
    return newObj;
}

现在,在另一个 html 文件(event.html,我在 index.html 文件中使用按钮输入)中,我使用了这个:

<script type="text/javascript" src="../js/events/createEventOBJ.js"></script>

  <script>
    console.log(createObj());
  </script>

但它是空的,为什么?

而且,另一个问题是:

如果在 event.html 我有这样的东西:

<div id="idevent" class="classGraph"></div>

在 createEventObj.js 我使用这个:

  var event1 = document.getElementById('idevent');

event1 未定义,为什么?

标签: javascripthtml

解决方案


到 html 页面之间的 Js 变量(例如您创建的对象)是独立的。这意味着他们有不同的实例,你不能像那样共享对象。如果您在 index.html 上并且您要转到另一个页面,则 index.html 中的每个 js 变量都会被销毁。

如果你想在两个页面之间共享一些变量,你需要使用 cookie 或本地存储,或者有后端来存储这些值。或者你需要SPA


推荐阅读