在网页设计中，图片和视频的切换是常见的交互效果。jQuery作为一款强大的JavaScript库，可以极大地简化这一过程。本文将详细介绍如何使用jQuery一键设置元素的
src
属性，实现图片和视频的切换。
基础准备
在开始之前，请确保您的网页中已经引入了jQuery库。以下是引入jQuery的常用代码：
HTML结构
首先，我们需要构建一个简单的HTML结构，用于展示图片和视频。以下是一个示例：
在这个例子中，我们有一个
div
容器，里面包含了一个
img
元素和一个
video
元素。这两个元素的
id
分别为
image1
和
video1
。
jQuery脚本
接下来，我们将编写一个jQuery脚本，用于在点击按钮时切换图片和视频。
代码解析
当文档加载完毕后，我们绑定了一个点击事件到
#toggle-media
按钮。
当按钮被点击时，我们首先获取当前第一个子元素的
src
属性。
接着，我们根据当前第一个子元素是
img
还是
video
来决定下一个元素的
src
。
最后，我们将第一个子元素的
src
属性设置为下一个元素的
src
。
总结
通过以上步骤，我们成功地使用jQuery实现了一键切换图片和视频的功能。这种方法简单易用，可以轻松地应用于各种网页设计中。