Можно ли сократить этот Javascript с помощью JQuery? - PullRequest
Новая
       1

Можно ли сократить этот Javascript с помощью JQuery?

2 голосов
/ 05 сентября 2010

Я проверяю некоторый новый учебный код API Карт Google.

У них есть пример , который говорит о том, как динамически добавить какой-либо скрипт на страницу после завершения загрузки страницы,Мне интересно, можно ли сделать этот код короче, если я использую JQuery?

вот код ... 

function initialize() {
  var myLatlng = new google.maps.LatLng(-34.397, 150.644);
  var myOptions = {
    zoom: 8,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

function loadScript() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
  document.body.appendChild(script);
}

window.onload = loadScript;

возможно?

Ответы [ 5 ]

2 голосов
/ 05 сентября 2010

Конечно, вы можете поменять несколько звонков на jQuery, но я не думаю, что вы здесь сильно сократите что-либо.

Это будет выглядеть примерно так в jQuery: 

function initialize() {
  var myLatlng = new google.maps.LatLng(-34.397, 150.644);
  var myOptions = {
    zoom: 8,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map($("#map_canvas").get(0), myOptions);
}

$(document).ready(
  function{ 
    $.getScript('http://maps.google.com/maps/api/js?sensor=false&callback=initialize');
  });
1 голос
/ 05 сентября 2010

Не совсем.Конечно, недостаточно, чтобы компенсировать загрузку jQuery объемом 50-80 КБ.

Я оправдываю это большей частью этого кода использованием библиотеки карт Google.jQuery не сможет взаимодействовать с большей частью этого, и, кроме того, учитывая то, что он делает, он уже довольно компактен.Я не вижу вашей проблемы с этим кодом.

Возможно, вы могли бы немного его сжать ... Но это экономит ваши байты за счет читабельности. 

function initialize() {
    var myLatlng = new google.maps.LatLng(-34.397, 150.644);
    var map = new google.maps.Map(document.getElementById("map_canvas"), {
        zoom: 8,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
}

window.onload = function() {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
    document.body.appendChild(script);
};
0 голосов
/ 05 сентября 2010

Вы можете избежать внедрения скрипта, разместив скрипт прямо на странице и даже удалив некоторые бесполезные переменные, например: 

<body>
<div id="map_canvas" style="width:100%; height:100%"></div>
<script>
  function initialize() {
    return new google.maps.Map(document.getElementById("map_canvas"),{
   zoom: 8,
   center: new google.maps.LatLng(-34.397, 150.644),
   mapTypeId: google.maps.MapTypeId.ROADMAP
 });
}
</script>
<script src="http://maps.google.com/maps/api/js?sensor=true&callback=initialize">
</script>
</body>
0 голосов
/ 05 сентября 2010

jQuery имеет собственный загрузчик скриптов, getScript () .

0 голосов
/ 05 сентября 2010 
function initialize() {
  var myLatlng = new google.maps.LatLng(-34.397, 150.644);
  var myOptions = {
    zoom: 8,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map($("#map_canvas").get(0), myOptions);
}

$(function{
  $("<script></script>").attr("type", "text/javascript").attr("src", "http://maps.google.com/maps/api/js?sensor=false&callback=initialize").appendTo("head");
});

Или, с предложением @ Tgr: 

$.getScript("http://maps.google.com/maps/api/js?sensor=false&callback=initialize", function(){
      var myLatlng = new google.maps.LatLng(-34.397, 150.644);
      var myOptions = {
        zoom: 8,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      }
      var map = new google.maps.Map($("#map_canvas").get(0), myOptions);
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...