获取多个input标签，并动态改变input标签的name属性

最新推荐文章于 2024-08-02 15:54:05 发布

smile_life_

最新推荐文章于 2024-08-02 15:54:05 发布

阅读量7.5k

点赞数 5

分类专栏：前端文章标签： javascript

本文链接：https://blog.csdn.net/smile_life_/article/details/52712982

版权

前端专栏收录该内容

19 篇文章 1 订阅

订阅专栏

网上找了很多，都不如意，后来安装了个谷歌浏览器调试，发现问题：list数组中的值居然变少了，但不知道为什么会这样，求大神解答。原理我不知道，但是稍微修改下代码，还是实现了

<script type="text/javascript">
        //动态改变
        function test(){
            var list = document.getElementsByName("a");
            var count = list.length;
            for(var i=0;i<count;i++){
                list[0].name = "b";
            };

            //这样是赋值不完全的，通过调试发现，当name属性的
            //值发生改变后，list数组中就会少一个input,不明白其中原因
            //for(var i=0;i<list.length;i++){
            //  list[i].name = "b";
            //};
        }

        //测试是否改变成功
        function test1(){
            var list = document.getElementsByName("b");
            for(var i=0;i<list.length;i++){
                alert(list[i].name+"  "+list[i].value);
            };
        }
    </script>
  </head>

  <body>
    <input type="text" name="a" value="1">
    <input type="text" name="a" value="2">
    <input type="text" name="a" value="3">
    <input type="text" name="a" value="4">
    <input type="button" onclick="test()" value="获取name为a的标签集合并修改name值">
    <input type="button" onclick="test1()" value="测试修改后的name值">

  </body>