JavaScript选择器

x33g5p2x  于2021-10-07 转载在 JavaScript  
字(1.4k)|赞(0)|评价(0)|浏览(268)

JavaScript选择器

通过 id 来查找 HTML 元素

比如

<p id="#a1">huanmin</p>
<script type="text/javascript"> var name=document.getElementById("a1") console.log(name) </script>

同过name选择器查找所有name属性的元素

document.getElementsByName(""); 返回的是数组****一般用于表单

<form action="#" method="get">
	姓名:<input type="text" name="name" value="hu"/>
	姓名1:<input type="text" name="name" value="hu1" />
	姓名2:<input type="text" name="name" value="hu2" />
</form>
<script type="text/javascript"> var str=document.getElementsByName("name"); for (var i = 0; i < str.length; i++) { console.log(str[i].value) } </script>

通过 CSS 选择器查找 HTML 元素

document.getElementsByClassName() 返回的是数组

<ul>
			<li class="da">a</li>
			<li class="da">b</li>
			<li class="da">c</li>
		</ul>
		<script type="text/javascript"> var str = document.getElementsByClassName("da") for (var i = 0; i < str.length; i++) { console.log(str[i].innerHTML) } </script>

通过标签名来查找 HTML 元素

document.getElementsByTagName() 返回的是数组

<p>a</p>
		<p>b</p>
		<p>c</p>
		<script type="text/javascript"> var str = document.getElementsByTagName("p") for (var i = 0; i < str.length; i++) { console.log(str[i].innerHTML) } </script>

相关文章