js获取对象的方法，根据id、根据name、根据标签名、根据类名

最新推荐文章于 2024-07-26 11:41:15 发布

在下，杨江河

最新推荐文章于 2024-07-26 11:41:15 发布

阅读量3k

点赞数 1

分类专栏： Mac开发文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/Rockandrollman/article/details/128571500

版权

Mac开发专栏收录该内容

294 篇文章 3 订阅

订阅专栏

正文

下面的代码中展示了常用的js获取html对象的方法，并且添加了详细的注释说明。快来看看吧。

// 页面加载完毕以后再执行
			window.onload=function(){
				//1.根据id获取对象
				var obj = document.getElementById("tel");
				alert(obj.value);
				var divobj=document.getElementById("d1");
				alert(divobj.innerHTML); //输出对象的innerHTML，双标签中的内容
				//2.根据name获取对象,返回的是数组
				var arr = document.getElementsByName("sex");
				for(var i = 0;i<arr.length;i++){
					alert(arr[i].value)
				}
				//3.根据tagname标签名获取对象，返回的也是数组
				var brr = document.getElementsByTagName("p");
				for(var i = 0;i<brr.length;i++){
					alert(brr[i].innerHTML);
				}
				// 4.根据class类别名获取对象
				var crr = document.getElementsByClassName("news");
				for(var i = 0 ; i < crr.length ; i++){
					alert(crr[i].innerHTML)
				}
				
			}

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/index.js"></script>
	</head>
	<body>
		<input id="tel" type="text" value="136"/>
		<div id="d1">
			aaa<span>111</span>
		</div>
		<input type="radio" name="sex" value="男"/>男
		<input type="radio" name="sex" value="女"/>女
		<p>111</p>
		<p>111</p>
		<p>111</p>
		<p>111</p>
		<p>111</p>
		<div class="news">aaa</div>
		<div class="news">bbb</div>
		<div class="news">ccc</div>
		<div >ddd</div>
	</body>
</html>