動態加載外部JavaScript文件

<html> 
<head> 
    <title>geocoder test</title> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script> 
     function jsonp(src){ 
      var s = document.createElement("script"); 
      s.charset = "UTF-8"; 
      s.src = encodeURI(src); 
      s.id = 'jsonp'; 
      document.body.appendChild(s); 
      return s; 
     }; 

     function showMap(json){ 
      var mapCanvas = document.getElementById('map_canvas'), 
       jsonp = document.getElementById('jsonp'); 
      if(json.Status.code !== 200){ 
       mapCanvas.innerHTML = 'Address not found'; 
       return false; 
      } 
      var ll = json.Placemark[0].Point.coordinates, 
       latlng = new google.maps.LatLng(ll[1], ll[0]), 
      myOptions = { 
       zoom: 16, 
       center: latlng, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }, 
      map = new google.maps.Map(mapCanvas, myOptions), 
      marker = new google.maps.Marker({ 
       position: latlng, 
       map: map 
      }); 
      jsonp.parentNode.removeChild(jsonp); 
     } 

     function getMap(address){ 
      jsonp([ 
       'http://maps.google.com/maps/geo?', 
       'q=' + address, 
       '&output=json', 
       '&sensor=false', 
       //'&key= ... place here your key if not on localhost ...', 
       '&callback=showMap' 
      ].join('')); 
     } 
    </script> 
</head> 
<body> 
    <input type="text" value="gran place, brussels"/><input type="button" onclick="getMap(this.previousSibling.value)" value="Get Map"/> 
    <div id="map_canvas" style="width:100%; height:450px"></div> 
</body> 
</html>

來源

2010-01-04 22:11:00 Mic

jQuery有所做的正是這樣的功能：$.getScript。例如：

$.getScript('/script.js', function() 
{ 
    alert('Script loaded!'); 
});

來源

2010-01-04 23:45:46

動態加載外部JavaScript文件

回答

相關問題