JavaScript 学习笔记 - 15 用 jQuery 设计页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery 示例</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
.highlight { background-color: yellow; }
</style>
</head>
<body>
<ul id="myList">
<li>苹果</li>
<li>香蕉</li>
<li>樱桃</li>
</ul>
<button id="highlight">突出显示第二个列表项</button>
<script>
$(document).ready(function() {
$('#highlight').click(function() {
$('#myList li:eq(1)').addClass('highlight');
});
});
</script>
</body>
</html>这个示例展示了如何使用jQuery库来处理DOM元素。页面中有一个按钮和一个列表，当按钮被点击时，列表的第二个项会被高亮显示。这个简单的例子演示了如何使用jQuery的click事件处理函数和addClass方法来改变样式。
评论已关闭