js中通过getElementsByName访问name集合对象的方法

前端之家收集整理的这篇文章主要介绍了js中通过getElementsByName访问name集合对象的方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

1、查找给定name属性的所有元素,这个方法将返回一个节点集合,也可以称为对象集合。

2、这个集合可以作为数组来对待,length属性的值表示集合的个数。

3、因为在html页面中,name不能唯一确定一个元素,所以方法名称为getElementsByName而不是getElementByName

无<a href="https://www.jb51.cc/tag/biaoti/" target="_blank" class="keywords">标题</a>文档

<script>
    /*
    1、<a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a>每一个文本框的值
    2、<a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a>每一个文本框的类型
    3、为每一个文本框<a href="https://www.jb51.cc/tag/zengjia/" target="_blank" class="keywords">增加</a>点击事件
    */

    /*
        第一步 <a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a>name<a href="https://www.jb51.cc/tag/shuxing/" target="_blank" class="keywords">属性</a>为luck值得对象数组(节点数组)
    */
    var luckElements = document.getElementsByName("luck");

    /*
        第二步 遍历节点数组
    */
    for(var i=0;i<luckElements.length;i++){
        //<a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a>元素的value值
        alert(luckElements[i].value);
        //<a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a>元素的type值
        alert(luckElements[i].type);
        //为每一个元素的onclick<a href="https://www.jb51.cc/tag/shuxing/" target="_blank" class="keywords">属性</a>赋值即为文本框<a href="https://www.jb51.cc/tag/zengjia/" target="_blank" class="keywords">增加</a>点击事件
        luckElements[i].onclick=function(){
            alert(this.value);
        }
    }
</script>

3、因为在html页面中,name不能唯一确定一个元素,所以方法名称为getElementsByName而不是getElementByName

以上就是小编为大家带来的JavaScript中通过getElementsByName访问name集合对象的方法全部内容了,希望大家多多支持编程之家~

原文链接:https://www.f2er.com/js/44753.html

猜你在找的JavaScript相关文章