html 按标签名称获取元素

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html 按标签名称获取元素相关的知识，希望对你有一定的参考价值。

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>DOM TEST</title>
</head>
<body>
	<div id="container">
		<div class="row">
			<h1>Hello World</h1>
			<a href="#">Click Here</a>
		</div>
		<div class="row">
			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum beatae quas praesentium. Distinctio hic vel nihil, eum facilis doloremque incidunt atque autem dolor est esse fugit tempora ea magni, quis.</p>
		</div>
		<div class="row">
			<ul>
				<li><a href="#">How are you</a></li>
				<li><a href="#">How do you do</a></li>
				<li><a href="#">What are you doing</a></li>
				<li><a href="#">Where do you live</a></li>
			</ul>
		</div>
	</div>

	<script>
		var container = document.getElementById("container");
		container.style.backgroundColor = "#e3e3e3";
		container.style.padding = "20px";

		var myHeader = document.getElementsByTagName("h1");
		console.log(myHeader);
		myHeader[0].style.color = "red";
		var myLinks = document.getElementsByTagName("a");
		console.log(myLinks);
		myLinks[1].style.color = "green";

	</script>

</body>
</html>

以上是关于html 按标签名称获取元素的主要内容，如果未能解决你的问题，请参考以下文章

怎样获取元素节点的标签名称

元素的jQuery标签名称

Jquery 获取元素标签名称

如何确定 jQuery 中匹配元素的元素类型？

XPath 表达式查找标签名称包含“名称”的元素

按名称仅获取 XML 直接子元素