js如何给多个div添加id

Question

<div class="wrap">

    <div class="test"></div>

    <div class="test"></div>

    <div class="test"></div>

</div>

我想要给每个.test添加id

变成

<div class="test" id="test-1"></div>

<div class="test" id="test-2"></div>

<div class="test" id="test-3"></div>

这该怎么实现?

用js jquery 都可以

Answer 1

$(".wrap .test").each(function(i) {&nbsp; &nbsp; $(this).attr('id', 'test-' + (i + 1))})

Answer 2

直接JS来改。var eles = document.querySelectorAll('.wrap .test');eles.forEach(function(v, i) {&nbsp; &nbsp; v.setAttribute('id', 'test-' + (i + 1))})

Answer 3

const classname = 'test';let tests = document.querySelectorAll(`.${classname}`);for (let i = 0, length = tests.length; i < length; i++) {&nbsp; &nbsp;tests[i].setAttribute('id', `${classname}-${i + 1}`)}

Answer 4

原生js就4行代码：&nbsp; &nbsp; let arr = document.querySelectorAll("div[class='test']");&nbsp; &nbsp; for(let i=0; i<arr.length; i++){&nbsp; &nbsp; &nbsp; &nbsp; arr[i].setAttribute("id",'test-'+i)&nbsp; &nbsp; }