在img添加新属性
部分HTML:
  <div class="datu_box"><img id="main_img" src="imgs/datu.jpg" alt="标题"/></div>
   <ul class="xiaotu_box">
    <li><img src="imgs/xiaotu_01.jpg" dataLarge="imgs/datu.jpg" alt="标题"/></li>
    <li><img src="imgs/xiaotu_02.jpg" dataLarge="imgs/datu.jpg" alt="标题"/></li>
    <li><img src="imgs/xiaotu_03.jpg" dataLarge="imgs/datu.jpg" alt="标题"/></li>
    <li><img src="imgs/xiaotu_04.jpg" dataLarge="imgs/datu.jpg" alt="标题"/></li>
    <li class="last fr"><img src="imgs/xiaotu_05.jpg" dataLarge="imgs/datu.jpg" alt="标题"/></li>
   </ul>
部分javascript
//鼠标经过小图大图变化

$('.xiaotu_box img').mouseover(function(){
document.getElementById("main_img").src=this.dataLarge;
})
结果会报错，原因应该是img中没dataLarge属性，那如何添加呢？
求解答，感激不尽！
------解决方案--------------------
document.getElementById("main_img").src=$(this).attr('dataLarge');
------解决方案--------------------
$('.xiaotu_box img').mouseover(function(){
$('#main_img').attr('src' , $(this).attr('dataLarge'));
})

用了jQuery就尽量用jQuery写，不要一下jQuery，一下document.getXXXX