jquery kullanırsanız ilk fonskiyonunuz üzerinde bir kaç değişiklik tüm istediğinizi yapabilir. Frameworkler bize dilleri unutturur oldu.
<!DOCTYPE html>
<html>
<head>
<style>
div[id^="content"]{
display:none;
}
div[id^="content"]:nth-of-type(1){
display:block;
}
</style>
<script type="text/javascript">
function show(id){
var count = 3;
var num = id.split("-");
for(i=1; i<count+1; i++){
document.getElementById('content-'+i).style.display = 'none';
}
document.getElementById('content-'+num[1]).style.display = 'block';
return false;
}
</script>
</head>
<body>
<a id = "tab-1" onclick="return show(this.id)" href="#">sh1</a>
<a id = "tab-2" onclick="return show(this.id)" href="#">sh2</a>
<a id = "tab-3" onclick="return show(this.id)" href="#">sh3</a>
<div id="content-1"> content 1</div>
<div id="content-2"> content 2</div>
<div id="content-3"> content 3</div>
</body>