<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>选择器</title>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
// alert('jquery里选择器很多, 只需要掌握常用的选择器, 其他选择器在需要的时候再去jquery查询.')
//jquery读取元素, 和css元素式样相仿.
$(function(){
var $div01 = $('#div01');
var $div23 = $('.div');
var $li = $('.list li');
// $div01.css({'color:violet'});
// 语法错误,css({})传入style风格的时候, 属性和参数需分别用引号包裹, 中间夹冒号:,jQuery的大括号内慎用;分号
$div01.css({'color':'violet'});
$div23.css({'color':'green'});
// 带'-'的样式属性.可以写成驼峰式,也可以写成'-';
$li.css({'background-color':'pink','color':'black'})
})
</script>
</head>
<!-- <style type="text/css">
#div01{
color: red;
}
.div{
color: green;
}
.list li{
background-color: pink;
}
</style> -->
<body>
<div id="div01">这是第一个div元素</div>
<div class="div">这是第2个div元素</div>
<div class="div">这是第3个div元素</div>
<ul class="list">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
</ul>
</body>
</html>
