码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript的DOM_获取元素方法_getElementsByName()获取相同名称(name)的节点列表

时间:2015-06-19 01:20:26      阅读:295      评论:0      收藏:0      [点我收藏+]

标签:

一、通过标签的name属性获取节点

  1、getElementsByName()方法通过标签的name属性获取节点,因为name有相同,所以返回一个对象数组HTMLCollection(NodeList)。

<script type="text/javascript">
    window.onload = function () {                         
        if(document.getElementsByName){   
            var box = document.getElementsByName(‘text‘)[0];
            alert(box); 
            box.style.color="red";            
        }else{
            alert("浏览器不兼容,请更换")
        }
    };

</script>
</head>

<body>
    <div name=‘text‘ id="box">测试Div</div>
</body>
</html>

 

 

   2、对于并不是 HTML 合法的属性,那么在 JS 获取的兼容性上也会存在差异,IE 浏览器支持本身合法的 name 属性,而不合法的就会出现不兼容的问题。

    (IE浏览器在获取不合法的HTML中的name时,会获取不到,也就是说name属性本身不是div的属性,所以IE就被忽略掉了)

<script type="text/javascript">
    window.onload = function () {                         
        if(document.getElementsByName){   
            var input = document.getElementsByName(‘test‘)[0];
            alert(input);            //HTMLInputElement]
            alert(input.name);
            alert(input.value);
            //input中有合法的name属性,所以IE也就支持了
        }else{
            alert("浏览器不兼容,请更换")
        }
    };

</script>
</head>

<body>
    <div id="box">测试Div</div>
    <input type="checkbox" name="test" value="测试" checked="checked"/>
</body>
</html>

 

JavaScript的DOM_获取元素方法_getElementsByName()获取相同名称(name)的节点列表

标签:

原文地址:http://www.cnblogs.com/LO-ME/p/4587403.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!