标签页 html实现原理,原生js的tab标签页

/p>

#content div{

width: 300px;

height: 200px;

border: 1px solid #abcdef;

display: none;

}

#content div.show{

display: block;

}

• php
• ruby
• python

php。。。。。。介绍

ruby。。。。。。介绍

python。。。。。。介绍

var ul = document.getElementById(‘ul’);

var li = ul.getElementsByTagName(‘li’);

var content = document.getElementById(‘content’);

var div = content.getElementsByTagName(‘div’);

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

li[i].index = i;

li[i].οnclick=function(){

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

li[i].className=”;

div[i].style.display=’none’;

};

this.className=’current’;

div[this.index].style.display=’block’;

}

};