css选择器了解

Original 2019-04-15 17:16:07 209
abstract:<!DOCTYPE html> <html> <head> <title>css选择器</title> </head> <body> <ul id="ul"> <li class="red">列表1</li&
<!DOCTYPE html>
<html>
<head>
	<title>css选择器</title>
</head>
<body>
	<ul id="ul">
		<li class="red">列表1</li>
		<li class="green">列表1</li>
		<li class="red">列表1</li>
		<li class="green">列表1</li>
		<li class="red">列表1</li>
	</ul>
<!-- getElementById	获取id,唯一性 -->
<script type="text/javascript">
	var ul=document.getElementById('ul')
	console.log(ul);
// getElementsByTagName	获取标签,是一个数组
	var li=document.getElementsByTagName('li')
	console.log(li);
//getElementsByClassName 	获取class,是一个数组;
	var cl=document.getElementsByClassName('green')
	console.log(cl);



//下面的方法和上面的获取值一样,获得数组就加All,后面跟上对应的id/class属性或者标签名;
	// let ul=document.querySelector('#ul');
	// console.log(ul);
	// let ul=document.querySelectorAll('li');
	// console.log(ul);
	// let ul=document.querySelectorAll('.green');
	// console.log(ul);
</script>
</body>
</html>


Correcting teacher:查无此人Correction time:2019-04-16 10:01:04
Teacher's summary:完成的不错。有了css样式,可以让页面更美,更绚丽。继续加油。

Release Notes

Popular Entries