Question

怎么用js给div内嵌套的多个span添加id？

如图，只有最外层<div>的id值，里面嵌套了多个<div>，每个div内都有一个<span>,怎么给每个span添加id，（id=span1，id=span2，id=span3....）？

Answer 1

1. 首先定位到 id= div1的那个盒子，把范围限定在其中，因为span标签在其中；
   

2. 获取元素方法:

   方法①：let div1_spans = document.querySelectorAll("div#div1 span");

   方法②：let div1_spans = document.querySelector("div#div1").getElementsByTagName("span");

3. 接着再声明一个变量span_len来保存span标签的个数（就是长度），以便在使用for循环时不用每循环一次都要检测span标签的个数，否则会造成繁琐的性能消耗；

   let span_len = div1.spans.length;
   

4. 再使用for循环，

    for(let i = 0; i < span_len; i++) {

        div1_spans[i].setAttribute(" 'id',span"+( i + 1 ));

        //或者 div1_spans[i].id = "span" + (i + 1);

    }