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

作者：很楠不爱3 | 2024-02-19 07:11:44

踩

js根据name获取对象

正文

下面的代码中展示了常用的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)
				}
				
			}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

<!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>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

代码运行效果图

在这里插入图片描述

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/很楠不爱3/article/detail/113294