DOM(一)-12-(document获取节点byName)



【document对象——获取节点byName】


不是所有标签都具备name属性,具备name属性的有:表单标签、超链接标签




========================================================================================================




【示例】通过单击button拿到标签相关属性,将获取标签属性方法定义在getNodeByName中,重点演示document对象中的
getElementsByName方法,目标是即通过user这个名字获取节点


<html>
	<head>
	</head>
	
	<body>
		<script type="text/javascript">
		
			function getNodeByName(){
			
				var nodes = document.getElementsByName("user");//获取到的是一个数组,其内都是一个个节点
				
				alert(nodes.length);//弹出1,说明数组长度是1
				
				alert(nodes[0].nodeName);//弹出input
				
				alert(nodes[0].type);//弹出text,因为type和name都是该节点的属性,那么直接用该节点对象获取即可
				
				alert(nodes[0].value);//在网页中的文本框内输入什么,单击button后就弹出什么,因为value也是该节点的一个
				//属性,表示文本框中的内容(【注】表单中有两个属性:name和value)
			
			}
		
		</script>
		
		<input type="button" value="演示获取节点byName" οnclick="getNodeByName()" />
		<input type="text" name="user" />
	</body>
</html>






【总结】
document对象中的getElementById和getElementsByName两个方法区别:
(1)getElementById:通过标签的id属性值获取该标签节点对象,因为id值是唯一的,所以单数形式:Element,返回一个对象
(2)getElementsByName:通过标签的name属性获取节点,因为name有相同,所以复数形式:Elements,返回一个数组
(凡是复数形式的,返回的都是数组)


以上代码可以写成如下形式:
var userNode = document.getElementsByName("user")[0];
alert(userNode.value);
getElementsByName获取到的是一个数组,[0]表示其中第一个元素,那么userNode就是一个节点对象,不再是一个节点数组

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值