javascript - 使用 jQuery 获取 DOM 元素

Question

我有一个结构如下的网页:

  <canvas id="myCanvas"></canvas>

  @for(var i=0; i<10; i++) {
    <div class="my-element">
      <canvas></canvas>
    </div>
  }

此代码生成一个主 Canvas 。在其下方，正在生成其他 10 个动态生成的 div。实际上，这个循环只是用来显示我有一些动态生成的代码。主要要理解的是 my-element 部分。

在我的 JavaScript 中，我有以下内容:

$(function() {
  var mainCanvas = document.getElementById('myCanvas');
  initializeCanvas(mainCanvas);  // This works.

  var dynamicElements = $('.my-element');
  for (var i=0; i<dynamicElements.length; i++) {
    initializeCanvas($(dynamicElements[i])[0]);   // This does not work
  }
});

function initializeCanvas(canvas) {
  // do stuff
}

第一次调用 initializeCanvas 有效，因为我传入了一个实际的 HTML Dom 元素。但是第二个被多次调用的 initializeCanvas 失败了，因为它传递了其他内容。在这种情况下，如何获得与 document.getElementById 返回的元素类型相同的元素？

谢谢!

Answer 1

首先，这没有意义:$(dynamicElements[i])[0]

您正在获取 jQuery 元素，将其展开，然后再次用 jQuery 进行包装...

您只需从元素中获取canvas

dynamicElements.eq(i).find('canvas')[0] 应该可以完成这项工作