attrとpropの 違い と 使用用途

#はじめに
指定した属性の値を取得したい時に attr または propを使用するが
なぜ同じ用途のセレクタがあるのか？が疑問に思ったので調べた。

#attrとpropという関数について
##.attr
指定した属性の値を取得。
.attr(name) → .attr(値を取得したいプロパティを指定)
.attr(name, value) →　.attr(値を設定したい属性を指定, 設定する値を指定)

##.prop
指定した属性の値を取得。
.prop(name) → .attr(値を設定したいプロパティを指定)
.prop(name, value) → .attr(値を設定したい属性を指定, 設定する値を指定)

#attrとpropの違い
###取得する値が違う
・attrは、属性における値 を取得
・propは、プロパティの真偽 を取得

例：チェックした値を取得

$(":checkbox").click(function() {
   alert($(this).prop('checked'));     
　　　　　　alert($(this).attr('checked'));
});

###チェック時
attr　→　checked
prop　→　true

###非チェック時
attr　→　undefined
prop　→　false

#attrとpropの使用用途
HTMLの属性を取得する場合　→　attr
なぜなら、属性における値 を取得するから

input関連の値を取得する場合　→　prop
なぜなら、プロパティの真偽 を取得するから

#参考記事
jQueryにおけるattrとpropの違いと使いドコロまとめ

#コメント
実際にコードを書いて検証ツールで見るのが理解度が増すのと納得するのでオススメ
ちなみにオンラインコードエディタとやらを活用するとファイルを作成する手間が省けるので良い。