工作中接触到一专题的结构比较特殊,代码如下:
<div class="test"> <ul class="list"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> <div class="part"> <div>1-1</div> <div style="display:none;">2</div> <div style="display:none;">3</div> <div style="display:none;">4</div> <div style="display:none;">5</div> </div> </div> <div class="test"> <ul class="list"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> <div class="part"> <div>2-1</div> <div style="display:none;">2-2</div> <div style="display:none;">2-3</div> <div style="display:none;">2-4</div> <div style="display:none;">2-5</div> </div> </div>
要求点击每个.list下的li标签,控制该.list下同级的.part的div层的显示,同时不能影响页面其它的.list相关的层的显示!
刚开始觉得处理这个没什么技术难度,但动手的的时候还是遇到了点小问题,记录下实现代码:
提示:你可以先修改部分代码再运行。
运行代码中,注释部分是容易被忽视或误解的地方!
0条评论( 网友:0 条,站长:0 条 ) 网友评论{有您的评论更精彩....}