用getElementsByName获取元素数组,如何改变style样式呢??

来源:9-2 getElementsByName()方法

闯货的红灯3128172

2016-07-08 11:35

我是这样的:

function getnum(){

var mynode=document.getElementsByName("myt");

mynode.style.backgroundColor="#ccc";

alert(mynode.length);

}

这种有问题,不显示。正确的修改样式如何写啊?求大神指教

写回答 关注

3回答

  • 损失函数
    2016-07-08 13:42:09
    已采纳

    亲测可用,望采纳!

    <!DOCTYPE html>

    <html>

    <head>

    <meta charset="UTF-8">

    <title></title>

    </head>

    <body>

    <input type="text" name="a" value="1">

       <br>

       <input type="text" name="a" value="2">

       <br>

       <input type="text" name="a" value="3">

       <br>

       <button type="button" onclick="test();">测试</button>

    </body>

    <script>

    function test()

    {

    var a = document.getElementsByName('a');

    for (var i=0; i<a.length; i++) {

    a[i].style.backgroundColor="#00A5E3";

    }

    }

    </script>

    </html>

    闯货的红灯3...

    非常感谢!

    2016-11-29 15:57:02

    共 1 条回复 >

  • 慕村1994845
    2016-11-18 22:04:22

    本例中“myt”是元素集合,想要改变颜色,要对单一元素设置;可以看下下面的代码:

    <!DOCTYPE HTML>
    <html>
    <head>
    <script type="text/javascript">
    function getnum(){
      var mynode=document.getElementsByName("myt");
      for(var i=0;i<mynode.length;i++){
          if(i==0||i==2||i==4){
          mynode[i].style.color="red";
          }
          else{
           mynode[i].style.backgroundColor="pink";      
          }
      }
      
      alert(mynode.length);
    }
    
    </script>
    </head>
    <body>
    <input name="myt" type="text" value="1">
    <input name="myt" type="text" value="2">
    <input name="myt" type="text" value="3">
    <input name="myt" type="text" value="4">
    <input name="myt" type="text" value="5">
    <input name="myt" type="text" value="6">
    
    <br />
    <input type="button" onclick="getnum()" value="看看有几项?" />
    
    </body>
    </html>


  • weibo_
    2016-07-16 14:43:55

    需要对数组里的每一个元素单独的设置,楼上的代码就是一例

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468194 学习 · 21891 问题

查看课程

相似问题