1. 使用jquery修改div元素的背景色(随意颜色)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.4.1.min.js"></script>
</head>
<body>
<div>ppp
</div>
<script>
$('div').css('background',"#d90000")
</script>
</body>
</html>
2. 使用jquery修改div的子元素p的内容为"我是子元素"
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.4.1.min.js"></script>
</head>
<body>
<div>
<p>我是文字</p>
</div>
<p>
</p>
<script>
$('div p').html('我是子元素')
</script>
</body>
</html>
3. 使用jquery修改第二个p元素的背景色为"orange"
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.4.1.min.js"></script>
</head>
<body>
<div>
<p>我是第一个p元素</p>
<p>我是第二个p元素</p>
<p>我是第三个p元素</p>
</div>
<script>
$('p').eq(1).css('background','orange')
</script>
</body>
</html>
4 删除列表元素中最后一个li元素
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.4.1.min.js"></script>
</head>
<body>
<ul>
<li>元素01</li>
<li>元素02</li>
<li>元素03</li>
<li>元素04</li>
<li>元素05</li>
</ul>
<script>
$('ul li:last').remove()
</script>
</body>
</html>
5. 点击当前的p标签,弹出相对应的元素下标*
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.4.1.min.js"></script>
</head>
<body>
<p>我是第1个p标签</p>
<p>我是第2个p标签</p>
<p>我是第3个p标签</p>
<p>我是第4个p标签</p>
<script>
$('p').click(function(){
alert($(this).index())
})
</script>
</body>
</html>
6. 利用jquery中的animate()方法.点击id为btn的按钮,实现类名为box的元素,向左移动500px
<!DOCTYPE html>
<html lang="en">
<style>
.box{
width:100px;
height:100px;
position:absolute;
top: 50px;
left: 10px;
border: 1px solid #666;
}
</style>
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.4.1.min.js"></script>
</head>
<body>
<body>
<di class="box"></di>
<button id="btn">按钮</button>
<script>
$('#btn').click(function(){
$('.box').stop().animate({
"left":500+'px'
})
})
</script>
</body>
</html>