画像に新しいattribute_html/css_WEB-ITnoseを追加

HTML JavaScript

HTML の一部:

• 


• 


• 
...

• 

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 で記述するようにしてください。 .getXXXX

$('.xiaotu_box img').mouseover(function(){

$('#main_img').attr('src' , $(this).attr('dataLarge'));

})

jQuery を使用する場合は、jQuery を使用せず、document.getXXXX だけを使用してください

なぜなら、私はフロントエンド開発に携わり始めたばかりで、jQuery をもっと使いたいと思っているからです。セレクターはとても使いやすいので採用しましたが、おっしゃることは一理あります（笑）。

$('.xiaotu_box img').mouseover(function(){

$('#main_img').attr('src' , $(this).attr('dataLarge'));

})

jQuery を使用する場合は、jQuery を使用せず、document.getXXXX だけを使用してください
さて、jquery を使用せずに JavaScript のみを使用する場合は、どうすれば間違いを避けることができますか?

$('.xiaotu_box img').mouseover(function(){

$('#main_img').attr('src' , $(this).attr('dataLarge'));

})

jQuery を使用する場合は、jQuery の代わりに document.getXXXX だけを書いてみてください
document.getElementById("main_img").src=this.getAttribute('dataLarge'); を使用することもできます

ありがとうございます!