是否有一种方法可以使用Javascript向多个元素添加不同的ID？

Question

假设我有

<iframe> id="iframeid"
<div> </div>
<div> </div>
<div> </div>
<div> </div>
</iframe>

是否有使用JavaScript向div添加唯一ID的方法？例如

<iframe> id="iframeid"
<div>id="divid1"</div>
<div>id="divid2" </div>
<div>id="divid3" </div>
<div>id="divid4" </div>
</iframe>

Answer 1

您可以使用document.getElementsByTagName返回所有div元素。这将返回一个NodeList（在这种情况下为div），您可以使用括号表示法（或item方法，相同）访问该NodeList，该元素将返回Element Node。您可以使用.id=value或setAttribute(id,value)设置其属性ID。在我的示例中，我将div元素设置为id=id0 id=id1，依此类推。

      let myDivs = document.getElementsByTagName("div");
      for(let i=0 ; i<myDivs.length ;i++)
         myDivs[i].id = `id${i}`;

另外请注意，document.getElementsByTagName("div")返回页面中的所有div，如果只需要元素的div，例如，具有id=myiframe的iframe元素，则可以执行以下操作：

document.getElementById("myiframe").getElementsByTagName("div"); 

还请注意，此方法检测子树中的所有div，它不仅限于直接子级