测试 JSONP 跨域获取数据,发现在 console 里面可以看到远程数据,但在 HTML 里面无法显示。
Console 里面错误提示:
ReferenceError: Can't find variable: getJSONP
很奇怪的一个问题
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DEMO</title>
</head>
<body>
<div id="data" class="box"></div>
<script>
(function() {
var data = document.getElementById("data");
data.innerHTML = "placeholder";
function getJSONP(info) {
console.log(info);
console.log(info.city);
data.innerHTML = info;
}
var script = document.createElement("script");
script.src = "http://freegeoip.net/json/?callback=getJSONP";
document.body.appendChild(script);
})();
</script>
</body>
</html>
------解决思路----------------------
<script>
function getJSONP(info) {
console.log(info);
console.log(info.city);
data.innerHTML = info;
}
(function() {
var data = document.getElementById("data");
data.innerHTML = "placeholder";
var script = document.createElement("script");
script.src = "http://freegeoip.net/json/?callback=getJSONP";
document.body.appendChild(script);
})();
</script>