js通过a链接控制多个DIV只显示其中一个其它隐藏
2024-09-09 21:04:21
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head> </head> <body style="margin:50px 0;"> <div style="float:left; margin:0 auto; width:800px; padding-left:40px; line-height:25px;" >
<ul>
<li>
<a href="javascript:showDiv('id2');">显示id1的内容</a>
</li>
<li>
<a href="javascript:showDiv('id1');">显示id2的内容</a>
</li>
<li>
<a href="javascript:showDiv('id3');">显示id3的内容</a>
</li>
</ul>
</div> <div id="id1" align="center" style="display:" >
1111111111111111<a href="javascript:showDiv('id2');">我是id1内容的a链接,点击可回到id2的内容---显示id2内容</a>
</div> <div id="id2" align="center" style="display:none" >
222222222222222222222<a href="javascript:showDiv('id1');">我是id2内容的a链接,点击可回到id1的内容---显示id1内容</a>
</div> <div id="id" align="center" style="display:none" >
333333333333333333我是id3内容
</div>
<script language="javascript">
function showDiv(objId){
var objDiv=document.getElementById(objId);
var objDiv1=document.getElementById("id1");
var objDiv2=document.getElementById("id2");
var objDiv3=document.getElementById("id3");
objDiv1.style.display="none";
objDiv2.style.display="none";
objDiv3.style.display="none";
objDiv.style.display="";
}
</script>
</body>
</html>
最新文章
- Python标准库14 数据库 (sqlite3)
- form表单中enctype=";multipart/form-data";的作用
- day8---多线程socket 编程,tcp粘包处理
- Bugzilla 使用指南
- 基于jquery实现的文字淡入淡出效果
- select 1 from table where的作用?
- Matlab与外部接口:MAT文件基础
- oracle获得每周,每月,每季度,每年的第一天
- JavaScript的隐式转换
- 【Python】Markov text generator马尔科夫文字生成器
- android studio导入矢量svg图标技巧
- Dynamics CRM 导入用户数据错误 could not retrieve salesperson role
- 大数据平台Lambda架构详解
- luogu 4345 Lucas的变形应用
- 在过去五分钟内,TypeScript语言服务以外终止了5次
- 细说REST API安全之防止数据篡改
- openstack路由管理命令
- Ubuntu 12.04 安装Redis并设置主从复制
- 根据ip地址获取用户所在地
- MVC 3.0学习笔记(自定义控件)