首页 > 解决方案 > 访问 FOR LOOP 生成的克隆容器

问题描述

我有一个容器,我已经克隆了它以创建另外 3 个容器。我使用 Clone 属性的主要原因是因为我不想一次又一次地重写代码来制作相同的容器。现在我想为克隆的容器更新不同的数据。正如您在代码中看到的那样,我已经设法传递了原始容器的标题名称。现在我如何访问我的克隆容器并更改其中的数据。我已将我尝试过的代码放在下面(失败)。当我输入数据 [1]、数据 [0] 等时,没有任何更新。

当前的 JavaScript


$(document).ready(function() {
  var e = $('.column');          //column is the class which contains the container
  for (var i = 0; i < 3; i++) {
    e.clone().insertAfter(e);

  }
  
  
 document.getElementById("heading").innerHTML = ("TRAILER 22");
  

Javascript 失败,这不会更新网页上的任何内容。

$(document).ready(function() {
  var e = $('.column');
  for (var i = 0; i < 3; i++) {
    e.clone().insertAfter(e);

  }
  
  var data = document.querySelectorAll(".column");
  
 data[1].document.getElementById("heading").innerHTML = ("TRUCK 22");
 

});

标签: javascriptjquery

解决方案


您尝试对元素进行文档调用,这是不可能的。如果您想更改第一列(我将代码切换到 jQuery,是什么让它更容易):

$(document).ready(function() {
  var e = $('.column');
  for (var i = 0; i < 3; i++) {
    e.clone().insertAfter(e);

  }
  
  var data = $(document).find(".column:first-of-type");
  
 data.html("TRUCK 22");
 

});

推荐阅读