通过API获取网络的图片下载，这里以天行数据为例，做简要实验。
数据获取地址：网站地址（key请在个人中心获取，需注册，然后在个人中心复制，替换APIKEY即可）
1. Python方法
import requests
import json
def main():
# request / response
resp = requests.get('http://api.tianapi.com/meinv/?key=自己的KEY&num=10')
mydict = json.loads(resp.text)
for tempdict in mydict['newslist']:
# 这里的newslist要根据不同api中的名字做相应调整，此次天行的为newslist.
pic_url = tempdict['picUrl']
resp = requests.get(pic_url)
filename = pic_url[pic_url.rfind('/') + 1:]
try:
with open(filename, 'wb') as fs:
fs.write(resp.content)
except IOError as e:
print(e)
if __name__ == '__main__':
main()- 2. JavaScript(html)原生方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<!--div---加载的美女图片存放的地方-->
<div id="photos">
</div>
<button id="load">加载</button> <!--加载数据按钮-->
<!--用原生JS写 先给按钮绑定事件-->
<script type="text/javascript">
//即时调用函数(function(){}()) 或者+(function(){})
(function(){
//通过ID拿,然后绑定事件,这里不考虑浏览器兼容性问题
var btn = document.getElementById('load');
btn.addEventListener('click', function(){
//异步请求对象，偷偷的给服务器发送请求对象,这里暂时也不考虑浏览器兼容性问题
var xhr = new XMLHttpRequest();
//JS默认只能从自己的服务器取数据, 同源策略
//但是今天的绝大多数都提供数据接口的服务器都设置了运行跨域取数据
//浏览器中支持2种协议 方式 get--拿数据，资源； post---提交 http协议
//url-统一资源定位符，就是一个地址 uniform resouce locator
//第一个参数get/第二个参数url/第三个参数true--表示异步请求
xhr.open('get',
'http://api.tianapi.com/meinv/?key=自己的KEY&num=10', true);
//事件回调 onreadystatechange-就绪状态改变
xhr.onreadystatechange = function(){
//判断服务器响应是否完成，如果readyState==4,表示成功；服务器响应完成 正在传为2， 刚刚连上，还未传数据为1
//status表示状态，为200时，表示连接成功 服务器正常
if (xhr.readyState == 4){
//通过从服务器获取的数据，对页面进行DOM操作实现局部刷新
if (xhr.status == 200){
//字符串解析
var obj = JSON.parse(xhr.responseText);
var mmArray = obj.newslist;
var div = document.getElementById('photos')
for (var i = 0; i < mmArray.length; i += 1){
var picUrl = mmArray[i].picUrl;
var img = document.createElement('img');
img.src = picUrl;
img.width = '360';
div.appendChild(img);
}
}
}
}
//发出请求
xhr.send()
})
}());
</script>
</body>
</html>- 3. .get.JSON方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="photos"></div>
<button id="load">加载</button>
<script src="js/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
var url = 'http://api.tianapi.com/meinv/?key=自己的KEY&num=10'
$('#load').on('click', function(){
$.getJSON(url, function(obj){
var mmArray = obj.newslist;
for (var i = 0; i < mmArray.length; i += 1){
var img = $('<img>').attr('src', mmArray[i].picUrl).width(300);
$('#load').append(img);
}
})
})
})
</script>
</body>
</html>- 4. .ajax方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="photos"></div>
<button id="load">加载</button>
<script src="js/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
var urlStr = 'http://api.tianapi.com/meinv/?key=自己的KEY&num=10'
$('#load').on('click', function(){
$.ajax({
url: urlStr,
type:'get',
dateType:'json',
success:function(obj){
var mmArray = obj.newslist;
for (var i = 0; i < mmArray.length; i += 1){
var img = $('<img>').attr('src', mmArray[i].picUrl).width(300);
$('#load').append(img);
}
}
})
})
})
</script>
</body>
</html>