我按照老师的课程，为自己的网站部分添加了选项卡效果，但是很奇怪，不知道为什么添加了老师教的那部分代码，确实选项卡效果生效了，但是我原来用jquery代码做的一个切换效果为什么不行了，如果把老师的那部分js代码不引用，jquery效果的代码又有效了，不知道为什么，烦请老师解答，我把两部分代码粘贴如下：

老师那部分的代码，我是放在外部的js文件在html众引入的：

function $(id){
  return typeof id==='string'?document.getElementById(id):id;
}

window.onload=function(){
  // 标签的索引

  var lis=$('all-tit').getElementsByTagName('li'),
      divs=$('con').getElementsByClassName('all-content1');
   if(lis.length!=divs.length)
   return;
   for(var i=0;i<lis.length;i++){
    lis[i].id=i;
    lis[i].onclick=function(){
    for(var j=0;j<lis.length;j++){
      divs[j].style.display='none';
    }
    divs[this.id].style.display='block';

    }
   }   

}

我之前用jquery写的一个效果代码，这个我是直接放在html底部的：

$(document).ready(function(){

$(".img1").click(function(){
  $(".middle img").attr("src","img/athome1.png");

});


$(".img2").click(function(){
  $(".middle img").attr("src","img/athome2.png");

});


$(".img3").click(function(){
  $(".middle img").attr("src","img/athome3.png");

});


$(".img4").click(function(){
  $(".middle img").attr("src","img/athome4.png");

});


$(".img5").click(function(){
  $(".middle img").attr("src","img/athome5.png");

});


});