Существует ли js код ещё проще, чем этот?
<!DOCTYPE html>
<html>
<head>
<style>
span{
display: inline-block;
margin-right: 10px;
}
.content{
width: 130px;
}
.none{
display: none;
}
</style>
</head>
<body>
<span class='tab'>Tab1</span>
<span class='tab'>Tab2</span>
<span class='tab'>Tab3</span>
<div class="content">
<div class="c">aaaa a aaaaa aaaaaa a a a a aaaaaa aaaaaa aaaaa</div>
<div class="c none">bbbb bbbb bbbbb bbbb bbbb bbbbb bbbb bbbbb bbbb bbbbb</div>
<div class="c none">ccc ccccc cccccc ccccc cccccc ccccc ccccc</div>
</div>
<script>
var tabs = document.querySelectorAll('.tab')
var con = document.querySelectorAll('.c')
for (var i = 0; i < tabs.length; i++) {
tabs[i].addEventListener('click', function(e) {
for (var k = 0; k < tabs.length; k++) {
if (this == tabs[k]) {
con[k].classList.remove('none');
} else {
con[k].classList.add('none');
}
}
})
}
</script>
</body>
</html>