javascript - HTML、JavaScript : Get a value out of window. onclick 的函数

Question

我正在尝试制作一个包含一堆 Canvas 元素的网页，每个元素都用绘制的图片进行初始化，每个元素都有一个“下一个”按钮，可以循环浏览服务器端存储的一堆其他文件。为了使其正常工作，我需要下一个按钮来了解当前在其相应的 Canvas 元素中显示的图像。据我所知，该信息不能存储在单个按钮元素中，也不能存储在 Canvas 元素中，因此我认为我需要一个全局变量来存储与当前显示图像的名称配对的所有 Canvas 元素 -这样，当单击“下一个”按钮时，它可以查找其 Canvas 元素和图像，决定应该绘制下一个图像，然后绘制它。

但是，要查找页面中的所有 Canvas 元素，我似乎需要 window.onload 函数来确保我仅在页面完全加载后收集它们。但是，我找不到一种方法来获取我在该函数内部、外部和全局变量中收集的信息。我看到一个人展示了如何，如果您只是将内容放入在函数外部创建的列表中，则可以更新函数内部列表的内容 - 因为这是通过引用传递而不是传递来完成的 -按值，该列表将在函数外部可用，并填充适当的信息。但是，对于我的特定应用程序，这意味着我需要在创建列表时知道列表的长度......但脚本只能在 window.onload 函数内了解该长度。所以我似乎陷入了第 22 条军规。

举一个最小的例子，下面是如果我不必提前指定数组长度的话我会编写的代码。我使用数字 1 来指示每个 Canvas 从第一个图像开始(在 HTML 和 JavaScript 的其余部分中，我有一种将 Canvas 元素与数字配对的方法，以便它们找到要绘制的适当图像)。

var canList = new Array();

window.onclick = function() {
    var cans = document.getElementsByTag("canvas");
    for (i = 0; i < cans.length; i++) {
        canList[i] = [cans[i],1];
    }
}

我想要的行为是能够在代码的其他地方使用 canList 。显然这是行不通的，因为我没有在变量声明中指定 canList 的长度，但我只能通过首先创建 cans 变量来找到它。如果我将 canList 变量声明移到函数内部，它将不再在外部可用。

Answer 1

您不需要在创建时定义数组的长度。简单地说:

var array = new Array();

或

var array = [];

然后您可以根据需要定义任何一个索引:

array[n] = value;