JS 批量修改li标签

快乐的命令行

已于 2022-08-27 14:18:09 修改

阅读量471

点赞数

分类专栏： js笔记文章标签： javascript 前端 servlet

于 2022-08-27 14:05:51 首次发布

本文链接：https://blog.csdn.net/qq_45229597/article/details/126557472

版权

js笔记专栏收录该内容

1 篇文章 0 订阅

订阅专栏

js批量修改li标签。其中items为伪数组，可以转换为真数组不具有js中数组可以调用的一些方法。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
   <div id="box">
        <ul>
            <li class="shuzhi">111</li>
            <li class="shuzhi">456</li>
            <li class="shuzhi">789</li>
            <li class="shuzhi">10</li>
            <li class="shuzhi">11</li>
            <li class="shuzhi">12</li>
            <li class="shuzhi">13</li>
        </ul>


    </div>
  <script>
     var items = document.getElementsByClassName("shuzhi")
     console.log(items)
     for (var i =0;i<items.length;i++){
         items[i].innerHTML = "news-"+i
     }
     //将伪数组转换为真数组
     var newitems = Array.from(items)
     console.log(newitems)
  </script>
</body>
</html>

效果如下