写了大半天，中间碰到几个问题，好在最后搞出来了，晒一晒-慕课网

首页课程实战体系课手记专栏慕课教程

写了大半天，中间碰到几个问题，好在最后搞出来了，晒一晒

来源：10-1 编程挑战

慕仔1561325

2019-01-20 17:53

<!DOCTYPE html>

<html>

<head>

/* CSS样式制作 */

body{font-size:100%;font-family:"Microsoft Yahei";}

body>div{margin:10px;padding:16px;height:190px;width:340px;}

.top{margin:0;padding:0;height:20%;}

.content{margin:0;padding:5px;height:65%;border:1px solid #069;border-top:2px solid #630; }

.top>div{height:36px; line-height:38px; width:70px;margin:0 5px;text-align:center;border:1px #CCC solid;border-bottom:none; float:left;}

.content>div.off{display:none}

.top>div.on{border-top:2px solid #630;border-bottom:2px solid #fff;}

</style>

// JS实现选项卡切换

window.onload=function(){

var div=document.getElementsByClassName('top')[0];

var menu=div.getElementsByTagName('div');

var content=document.getElementsByClassName('content')[0];

var txt=content.getElementsByTagName('div');

function click(x)

{

menu[x].onclick=function(){

for(var i=0;i<txt.length;i++)

{

txt[i].className='off';

menu[i].className='';

}

txt[x].className='';

menu[x].className='on'}

}

for(var i=0;i<menu.length;i++)

{ click(i); }

}

</script>

</head>

<body>

<div>

</div>

<div >275万购昌平邻铁三居总价20万买一居<br/>200万内购五环三居 140万安家东三环<br/>北京首现零首付楼盘 53万购东5环50平<br/>京楼盘直降5000 中信府公园楼王现房</div>

<div class="off">40平出租屋大改造美少女的混搭小窝<br/>经典清新简欧爱家 90平老房焕发新生<br/>新中式的酷色温情 66平撞色活泼家居<br/>瓷砖就像选好老婆卫生间烟道的设计</div>

<div class="off">通州豪华3居260万二环稀缺2居250w甩<br/>西3环通透2居290万 130万2居限量抢购<br/>黄城根小学学区仅260万 121平70万抛!<br/>独家别墅280万苏州桥2居优惠价248万</div>

</div>

</body>

</html>

写回答关注

1回答

白墨钰

2019-01-21 16:56:48

大佬，帮帮忙，看一下我的那个问题

0 0

JavaScript进阶篇

本课程从如何插入JS代码开始，带您进入网页动态交互世界

468061 学习 · 21891 问题

查看课程

相似问题

谁还会用switch ? 来都晒晒自己的成功的图

回答 4

终于写出来了，调试了半天。。。

回答 1

这个数组哪里问题，找了半天没找出来

回答 3

看了半天发现拼错一个字母。。。浪费好长时间

回答 3

搞了一个小时了，就是出不来，大家帮忙看一下到底哪错了？也是醉了

回答 3

打开慕课网App查看更多内容