所以我有两个html文件,它们都链接到另一个,并共享同一个css/js文件



所以我有两个html文件,它们都链接到另一个,并共享同一个css/js文件。当我在一个index.html上使用btn并单击它时,我希望它返回一些附加到index2.html上的section/div的内容。我有代码,但由于某种原因,当我运行它时,遇到了一个错误,所以我对它进行了console.log处理,它返回null。我如何访问另一个html文件中的元素?我需要将其导入到js中吗?索引:

<a href="index.html">home</a>
<a href="test.html">test</a>
<button class="btn" onclick="add()">addP</button>

索引2:

<a href="index.html">home</a>
<a href="test.html">test</a>

<h1>add p below </h1>

<div class="pbox">
</div>

我想访问div.pbox

您在这里面临一些问题。在主页上没有pbox,在测试页上也没有add button,这很容易通过一个条件来解决,看看它们是否存在或使用2个JavaScript文件。

你面临的下一个问题是如何存储信息并将其从一个页面获取到另一个页面。一旦页面重新加载,信息就会消失。在这种情况下,答案是本地存储。

加载页面时,它会检查本地存储中是否存在列表。如果它存在,它会获取信息并对其进行解析。如果它不存在,它只是一个空数组。这在两个页面上都会发生,因为它们都需要这些信息。

当测试页面加载时,它只需获取列表中的信息并映射到它上面,就可以用当时列表中的任何内容填充pbox

在主页上,单击按钮后,它会将新项目推送到列表阵列,然后更新本地存储。

这是Sandbox Link

相关内容

最新更新