DOM（一）-13-(document获取节点byTagName)

最新推荐文章于 2020-05-03 21:16:04 发布

wy_0928

最新推荐文章于 2020-05-03 21:16:04 发布

阅读量415

点赞数

分类专栏： No.7-JavaWeb自学笔记（五）——DOM

本文链接：https://blog.csdn.net/wy_0928/article/details/47809667

版权

No.7-JavaWeb自学笔记（五）——DOM 专栏收录该内容

42 篇文章 0 订阅

订阅专栏

【document对象获取节点byTagName】

（1）当节点有id时，可以通过docuemnt对象中的getElementById方法获取节点对象；

（2）当节点有name时，可以通过document对象中的getElementsByName方法获取节点数组；

（3）如果节点既没有id也没有name，该如何获取呢？
那么这种情况的标签，至少有标签名称，所以可以通过document对象中的getElementsByTagName方法获取节点数组。

该方法是通过标签名获取节点，因为标签名会重复，所以返回的是一个数组。

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

【示例】

<html>
	<head>
	</head>
	
	<body>
		<script type="text/javascript">
		
			//获取超链接节点对象，演示getElementsByTagName方法
			function getNodeByTagName(){
				
				//直接用标签名获取
				var nodes = document.getElementsByTagName("a");
				
				alert(nodes.length);//弹出2
				
				for(var x=0;x<nodes.length;x++){
					
					alert(nodes[x].innerHTML);//先后弹出新浪网站11和新浪网站22
					
					/*
					 *该方法应用之一：本来新浪网站11和新浪网站22两个超链接打开都是在当前页面打开，那么现在想全部在
					 *新标签页中打开，那么无非是在<a>内添加target="_blank"属性，一个个添加麻烦，这时候可以先用
					 *docuemnt对象中的getElementsByTagName("a")方法获取到节点数组，然后遍历该数组，拿到所有超链接
					 *的节点，然后直接逐一调用每个节点对象的target属性并将其修改即可，代码如下：
					 */
					 nodes[x].target = "_blank";//此时刚打开该网页，单击超链接依然是在当前页面打开，然后单击button，会在新标签页打开
				
				}
				
			}
		
		</script>
		
		<input type="button" value="演示getElementsByTagName方法" οnclick="getNodeByTagName()" />
		<a href="http://www.sina.com.cn">新浪网站11</a>                 //该标签id和name都没有
		<a href="http://www.sina.com.cn">新浪网站22</a>                 //该标签id和name都没有
	</body>
</html>