写一段前端代码,点击divA的时候隐藏div2和div3,显示div1的内容,点击divB的时候,隐藏div1和div3,显示div2的内容
时间: 2024-05-09 08:14:41 浏览: 184
网页设计div的显示和隐藏
3星 · 编辑精心推荐
可以使用jQuery实现,以下是示例代码:
```html
<div id="divA">A</div>
<div id="divB">B</div>
<div id="div1" class="content">内容1</div>
<div id="div2" class="content">内容2</div>
<div id="div3" class="content">内容3</div>
```
```javascript
$(document).ready(function() {
// 点击divA时的事件
$('#divA').click(function() {
$('#div2').hide();
$('#div3').hide();
$('#div1').show();
});
// 点击divB时的事件
$('#divB').click(function() {
$('#div1').hide();
$('#div3').hide();
$('#div2').show();
});
});
```
当点击`divA`时,`div2`和`div3`都会隐藏,`div1`会显示出来;当点击`divB`时,`div1`和`div3`都会隐藏,`div2`会显示出来。注意,需要引入jQuery库。
阅读全文