收藏
批改状态：合格
老师批语：
1、jquery的导入方法，需要用两个<script type="text/javascript"></script>进行设置。
进入百度程序员类库：
准确导入方式为：
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script type="text/javascript">
</script>
其中jquery代码编写在第二个行中
-
jquery代码的几个选择器：
1、标签选择器，编写方式为：
$('标签名').css（'background','red'）
2、类选择器
$('.类名').css（'background','red'）
3、id选择器
$(‘#ID名’).css（'background','red'）
4、通配符选择器
$('tr:nth-child(3)~*').css(‘background’,'red')
实际例子：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
<style type="text/css">
table{
width: 300px;
margin: auto;
text-align: center;
border-collapse: collapse;
}
table,td{
border: 1px solid;
}
td{
width: 10%;
height: 10%;
}
</style>
</head>
<body>
<table>
<caption>作业课程</caption>
<tr>
<th>很大</th>
<td class="td1">1</td>
<td id="td2">2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
</tr>
</table>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script type="text/javascript">
$('th').css('color','red')
$('.td1').css('background','brown')
$('#td2').css('font-weight','bold')
$('td:nth-child(3)~*').css('background','orangered')
</script>
</body>
</html>点击 "运行实例" 按钮查看在线实例
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
