首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在JavaScript中复制要遍历的div的最好方法是什么?

在JavaScript中复制要遍历的div的最好方法是什么?
EN

Stack Overflow用户
提问于 2018-08-22 06:10:38
回答 3查看 40关注 0票数 1

我正在使用JavaScript中的div来测试JavaScript的交集观察者api (https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API)。我本质上是在测试当div进入视区时,它能检测到它们有多好。我要测试的另一件事是,交集观察者api处理大量div的能力如何。目前我有30个手动复制的div,如下所示:

<div id="one">1</div>
<div id="two">2</div>
<div id="three">3</div>
<div id="four">4</div>
<div id="five">5</div>

我的目标是真正推动这个测试&可能有500+ div,但是我认为必须手动输入500+ div似乎有点傻。我想知道有没有更简单的方法来实现这个数量的多个div?我在网上读过,看到有人谈到要为它写一个脚本,但没有详细说明或示例,这将是有帮助的,因为我不完全理解它是如何工作的。

EN

回答 3

Stack Overflow用户

发布于 2018-08-22 06:18:29

您可以使用document.createElement

票数 0
EN

Stack Overflow用户

发布于 2018-08-22 06:23:04

如果你使用的是ES6,你可以这样做:

Array.from({length: 500}, (v, k) => {
  const div = document.createElement('div'); 
  const text = k + 1; 
  div.appendChild(document.createTextNode(text));
  div.setAttribute("id", text) // this would be the tricky part...
  return div
})

创建一个大小为N= 500的div数组。唯一要做的就是弄清楚如何让id属性从数字转换为字符串。对于这个问题,有一个类似的解决方案:

Convert digits into words with JavaScript

票数 0
EN

Stack Overflow用户

发布于 2018-08-22 06:32:08

与上面的答案类似,这里有一个快速小提琴:

const wrapper = document.getElementById("wrapper");

for(let i=0; i<500;i++)
{
    let el = document.createElement("div");
  el.classList.add("blu");
  el.innerHTML = "Div " + i;
  el.setAttribute("id", i);
  wrapper.appendChild(el);
}

https://jsfiddle.net/np49zjk1/13/

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51957391

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档