NMR 
「マウスクリックされた時に何かを起こす」という時の書き方で、click(function)とon(‘click’)という表記の2種類をよく見かけます。
何が違うんだろうか。疑問でした。
$(function(){
$(‘p’).on(‘click’,function(){
$(‘.text01’).css(‘color’,’red’);
});
});
$(‘p’).on(‘click’,function(){
$(‘.text01’).css(‘color’,’red’);
});
});
$(function(){
$(‘p’).click(function(){
$(‘.text01’).css(‘color’,’red’);
});
});
一見、click(function)の方が省略されていて、通の書き方に見えます。
効果的にも同じようです。
どっちの書き方が良いんだろう？
調べてみると、click(function)だと、HTMLのソースに書かれていない要素については、触ることができないらしい。
つまり、jQueryで追加したオブジェクトを触ることができないということみたい。
ふむふむなるほど。
on(‘click’,function）で書いた方が丁寧だし、追加要素も触ることができるので、こちらに統一して書くことにしました。
クリックをマウスオーバーに変更したい時なども、click→mouseenterのように、そのまま中身だけ変更すれば良いだけなので簡単かなあと思います。
on(‘mouseenter’,function)
↓
on(‘mouse leave’,function)
↓
on(‘mouse leave’,function)
この疑問については、こちらのQAが参考になりました。
https://teratail.com/questions/13050
この記事も読まれています