HTML之查找元素：DOM getElementsByName() 与getElementById()

代码如下：

<table class="sub_table" height="168">  
    <tbody>  
        <tr>  
            <td width="192"><spans style="font-weight: bold">统计项</spans></td>  
            <td width="192"><spans style="font-weight: bold">个数</spans></td>  
        </tr>  
        <tr>  
            <td>英文字母</td>  
            <td><span id="englishLet" name="tdspan"></span></td>  
        </tr>  
        <tr>  
            <td>数字</td>  
            <td><span id="number" name="tdspan"></span></td>  
        </tr>  
        <tr>  
            <td>中文汉字</td>  
            <td><span id="chineseChar" name="tdspan"></span></td>  
        </tr>  
        <tr>  
            <td>中英文标点符号</td>  
            <td><span id="punctuation" name="tdspan"></span></td>  
        </tr>  
    </tbody>  
</table>

id与name区别：

id是唯一的，对于每一个元素只有一个，所以是getElementById()

name是非唯一的,可以用来指一类元素，所以是getElementsByName()

区分：name与class，前者用于js获取。后者用于css获取处理样式。

getElementById() 用法：唯一获取

<script type="text/javascript" >  
    function clearTable(){  //清空表格内容  
        document.getElementsById(" chineseChar.innerHTML = '' ");  
    }  
</script>

document.getElementByName()用法：用迭代器列出一一处理

<script type="text/javascript" >  
    function clearTable(){  //清空表格内容  
        tdspans=document.getElementsByName("tdspan");  
        for(var i=0;i<tdspans.length;i++){  
            tdspans[i].innerHTML = " ";  
        }  
    }  
</script>

欢迎分享本文，转载请保留出处：前端ABC » HTML之查找元素：DOM getElementsByName() 与getElementById()