Question

有人可以向我解释有关getElementsByTagName的一些细节，特别是如何正确迭代getElementsByTagName返回的节点列表。

这是我的简单脚本，我想在警报窗口中显示所选索引，但使用getElementsByTagName。我知道使用getElementsByTagName来获取所选的选项值可能不是一个很好的解决方案，但我仍然希望使用getElementsByTagName，因为它可以帮助我更好地理解其工作原理

<script language="JavaScript">
<!--
   function process(){
     var a = document.getElementById('mySelect');
     var res = a.options[a.selectedIndex].text;

     alert(res);
   }
//-->
</script>

这是一个HTML代码段：

<body>
<select name=""id="mySelect" onchange="process()">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>

所以我的问题是：

有人可以告诉我如何使用getElementsByTagName代替getElementById来使这个脚本工作吗？

非常感谢！

Answer 1

使用getElementById获取select和getElementsByTagName以读取选项

function process(){
    var sel = document.getElementById("mySelect");
    var opts = sel.getElementsByTagName("option");
    for(var i=0;i<opts.length;i++){
        if(opts[i].selected){
             alert(opts[i].innerHTML);
             break;
        }
    }
}

Example

使用getElementsByTagName获取select和getElementsByTagName以获取选项

function process(){
    var sels = document.getElementsByTagName("select");
    for(var i=0; i<sels.length;i++){
        var opts = sels[i].getElementsByTagName("option");
        for(var j=0;j<opts.length;j++){
            if(opts[j].selected){
                 alert(opts[j].innerHTML);
                 break;
            }
        }
    }
}

使用getElementsByTag名称获取select和options对象

function process(){
    var sels = document.getElementsByTagName("select");
    for(var i=0; i<sels.length;i++){
        var sel = sels[i];
        alert( sel.options[sel.selectedIndex].text );
    }
}

Answer 2

getElementById返回单个元素，因为id应该是唯一的，因此如果给定的id存在，则应该只返回一个元素。

getElementsByTagName返回一个NodeList对象，其中包含具有给定标记名称的所有元素。

 <script language="JavaScript">
<!--
   function process(){
     var a = document.getElementsByTagName('select');
     var res = a[0].options[a[0].selectedIndex].text;

     alert(res);
   }
//-->
</script>

需要一些关于使用getElementsByTagName的建议

2 个答案: