0

谁能向我详细解释一下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？

非常感谢！

4

2 回答 2

3

使用 getElementById 获取选择并使用 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;
        }
    }
}

例子

使用 getElementsByTagName 获取选择并使用 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 名称获取选择和选项对象

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 );
    }
}
于 2011-10-12T14:46:50.370 回答
0

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>
于 2011-10-12T14:42:14.777 回答