EXIF情報を取得について javascript

写真を投稿するサービスを作っており、写真の詳細画面にてですが、写真のEXIFデータを表示したいと思っています。
そこでjavascriptでEXIF.jsというものをみつけました。
それを実装しようとしてコードを書いているのですが、実装できなくて困っています。
生javascirptに詳しい方、助けてください！

以下コードが問題のコードです。

//スライドメニューの処理
jQuery(function($) {//jQuery処理開始エリア 
  
  $('#img').ready(function() {
		// アップロードファイルからExif情報を抜出す。
		$(this).fileExif(function(exif) {
			console.log(exif);
		});
	});
	
});//jQuery処理終了エリア
</script>

(readyにしているのはonloadで動かなかったからです。)
ネット上のサンプルではこれで動きました。
http://amaraimusi.sakura.ne.jp/sample/js/jquery_exif_js/jquery_exif_js.html

以下は、エラー画面です。

宜しくお願いします。

すみません、以下画像表示のhtml部です。

      <div id="photo_img"><!--photo_imgエリアの開始-->
      <?php if($photo = $photos->fetch()):?>
        <h2><img src="photoimg/<?php print(htmlspecialchars($photo['photoimg'] , ENT_QUOTES)); ?>" width="1277" height="780" id="img" exif="true"></h2>
      <?php endif; ?>
      </div><!---photo_imgエリアの終了-->
    </div>
    <div id="share_list">
          <ul>
            <li><i class="share_icon far fa-heart fa-lg"></i></li>
            <li><i class="share_icon far fa-comment-alt fa-lg"></i></li>
          </ul>
    </div>