2016-03-30 118 views
0

我正在通过freecodecamp进行挑战,任务是显示当地天气,因此我必须获取用户的位置。我可以得到的位置from here但打印后,我试图得到div的ElementById我已经打印使用JS,它给出了null作为回应。我想获得关键值对,以便我可以与他们做东西。这里是我的代码:提前地理位置跟踪getElementById不工作

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 
 
     <title>Location Trace | freecodecamp Challanges</title> 
 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
 
    </head> 
 
    <body> 
 
     <div id="GeoResults"></div> 
 
     <script> 
 
     $.getJSON("http://ip-api.com/json/?callback=?", function(data) { 
 
      var table_body = ""; 
 
      var count = 0; 
 
      $.each(data, function(k, v) { 
 
\t \t \t \t //JSON.stringify(j); // '{"name":"binchen"}' 
 
\t \t \t \t 
 
\t \t \t \t table_body += '<div id=Coun_'+count+'>'+v+'</div>'; 
 
\t \t \t \t 
 
       //table_body += "<tr><td id='FC_"+count+"'>" + k + "</td><td><b id='SC_"+count+"'>" + v + "</b></td></tr>"; 
 
       count++; 
 
      }); 
 
      $("#GeoResults").html(table_body); 
 
     }); 
 
     </script> 
 
     <script> 
 
\t \t \t var x = document.getElementById('Coun_1') /*= 'Dooone!!!'*/; 
 
\t \t \t console.log(x); 
 
     </script> 
 
    </body> 
 
</html>

谢谢!

+3

您要添加使用异步API的那些元素,所以当的getElementById叫这些元素都没有添加到DOM –

+0

感谢您的快速回复阿伦,你能不能帮我通过详细阐述关于Async的内容。我从哪说起呢? –

+0

关于异步http://stackoverflow.com/questions/3393751/what-does-asynchronous-means-in-ajax – GuRu

回答

0

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 
 
     <title>Location Trace | freecodecamp Challanges</title> 
 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
 
    </head> 
 
    <body> 
 
     <div id="GeoResults"></div> 
 
     <script> 
 
     $.getJSON("http://ip-api.com/json/?callback=?", function(data) { 
 
      var table_body = ""; 
 
      var count = 0; 
 
      $.each(data, function(k, v) { 
 
\t \t \t \t //JSON.stringify(j); // '{"name":"binchen"}' 
 
\t \t \t \t 
 
\t \t \t \t table_body += '<div id=Coun_'+count+'>'+v+'</div>'; 
 
\t \t \t \t 
 
       //table_body += "<tr><td id='FC_"+count+"'>" + k + "</td><td><b id='SC_"+count+"'>" + v + "</b></td></tr>"; 
 
       count++; 
 
      }); 
 
      $("#GeoResults").html(table_body); 
 
      var x = document.getElementById('Coun_1').innerHTML; /*= 'Dooone!!!'*/; 
 
\t \t \t console.log(x); 
 
     }); 
 
     </script> 
 
    </body> 
 
</html>