JQuery相关实例应用
以下是一个使用jQuery实现的简单实例，它展示了如何在网页中使用jQuery来更改元素的文本内容。
HTML 部分:
<!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>
</head>
<body>
<p id="example">这是一个示例文本。</p>
<button id="changeText">更改文本</button>
<script src="script.js"></script>
</body>
</html>JavaScript (jQuery) 部分 (保存在 script.js 文件中):
$(document).ready(function() {
$('#changeText').click(function() {
$('#example').text('文本已更改！');
});
});这段代码做了以下几件事：
- 当文档加载完成后，使用
$(document).ready()确保DOM完全加载。 - 当按钮被点击时，使用
$('#changeText').click()监听事件。 - 使用
$('#example').text()方法更改具有ID为 "example" 的<p>标签的文本内容。
评论已关闭