如何获取HTML元素对应JavaScript对象，常用四种getElement方法浅析

最新推荐文章于 2022-04-24 22:50:09 发布

JAVAnuonuo

最新推荐文章于 2022-04-24 22:50:09 发布

阅读量1.1k

点赞数 1

文章标签： javascript html

本文链接：https://blog.csdn.net/weixin_46383723/article/details/107410980

版权

1、document.getElementById();通过id来获取对象

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<p id="test">实践是真理的唯一标准</p>
		<script>
			var element = document.getElementById("test");
			console.log(element);
		</script>
	</body>
</html>

2、document.getElementsByClassName();通过class来获取对象

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<p class="test">实践是真理的唯一标准</p>
		<div class="test">HelloWorld!</div>
		<script>
			var element = document.getElementsByClassName("test");
			for (var i=0;i<element.length;i++) {
				console.log(element[i]);
			}
		</script>
	</body>
</html>

3、 document.getElementsByName();通过name来获取对象

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<p name="test">实践是真理的唯一标准</p>
		<div name="test">HelloWorld!</div>
		<b name="test">11111</b>
		<script>
			var element = document.getElementsByName("test");
			for (var i=0;i<element.length;i++) {
				console.log(element[i]);
			}
		</script>
	</body>
</html>

4、 document.getElementsByTagName();通过标签来获取对象

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<b >11111</b>
		<b>22222</b>
		<b>33333</b>
		<script>
			var element = document.getElementsByTagName("b");
			for (var i=0;i<element.length;i++) {
				console.log(element[i]);
			}
		</script>
	</body>
</html>

JAVAnuonuo

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
如何获取HTML元素对应JavaScript对象，常用四种getElement方法浅析

1、document.getElementById();通过id来获取对象<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <p id="test">实践是真理的唯一标准</p> <script> var element = d
复制链接

扫一扫