ホームページ  >  記事  >  ウェブフロントエンド  >  画像に新しいattribute_html/css_WEB-ITnoseを追加

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

WBOY
WBOYオリジナル
2016-06-24 12:20:071122ブラウズ

HTML JavaScript

HTML の一部:
title


  • title

  • title

  • タイトル
  • ...
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'); を使用することもできます

ありがとうございます!

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。