Ajax通信　ブラウザ側の処理について(index.html)

今日はインターン最終日でした。
5日目、6日目に渡ってajax通信について勉強し作ったプログラムを載せます。

<!-- ブラウザ側の処理
WordPressにAjax通信のリクエストを投げる-->

 <!-- jQueryのCDNを使ったjQueryファイルの読み込み -->
 <!-- （１）JQueryを設定しよう -->
 <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>

<script> var wp_url_admin_ajax = 'http://tsukahara.local/wp-admin/admin-ajax.php'; </script>

<script>
jQuery(function($) {
  $.ajax({
    type: "POST",
    // （３）JQueryの$.ajaxに「crossDomain: true」のオプションを設定しよう
    crossDomain: true,
    url: wp_url_admin_ajax,
    data: {
      action: "tell_me"
    },
    success: function(response) {
      json = eval("(" + response + ")");
      var date = JSON.parse(response);

      for (i = 0; i < 104; i++) {
        create_marker(date[i].Latitude, date[i].Longitude);
      }

ポイントは、下から5行目です。

var date = JSON.parse(response);

サーバー側で行う処理で、AjaxはJSONファイルしか扱えないので、JSON形式にエンコードしています。
そのJSON形式にエンコードされたデータを使いたいので、今度はブラウザ側で文字列をJSON として解析してあげます。

JSON.parse　について詳しくはこちらを参考にして下さい。 https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse