一、免费API调用：

免费天气api接口 JS调用示例

<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>天气API</title>

</head>

<body>

<h3>天气</h3>

<ul id="box"></ul>

<h3>小时天气</h3>

<ul id="hours"></ul>

<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->

<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>

<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->

<script>

    $.ajax({

        type: 'GET',

        url: 'https://www.tianqiapi.com/api/',

        data: 'version=v1&city=济南',

        dataType: 'JSON',

        error: function () {

            alert('网络错误');

        },

        success: function (res) {

            $('#box').append('<li>City: ' + res.city + '</li>');

            $('#box').append('<li>Weather: ' + res.data[0].wea + '</li>');

            $('#box').append('<li>Tips: ' + res.data[0].air_tips + '</li>');

            // 遍历数组

            for (var i = 0; i < res.data[0].hours.length; i++) {

                $('#hours').append('<li>' + (i + 1) + ': 时间: ' + res.data[0].hours[i].day + ' 气温: ' + res.data[0].hours[i].tem + ' </li >');

            }

        }

    });

</script>

</body>

</html>

一、免费API调用的更多相关文章

  1. PHP免费API调用，使用(CURL)

    <?phpclass GetApiModel{//获取第三方API //获取身份证信息 //返回json /*{ "errNum": 0, "retMsg" ...

  2. 调用免费API查询全年工作日、周末、法定节假日、节假日调休补班数据

    前言 日常开发中,难免会用到判断今天是工作日.周末.法定节假日.节假日调休补班做一些业务处理,例如:仅在上班时间给用户推送消息.本文记录调用免费API查询全年工作日.周末.法定节假日.节假日调休补班数 ...

  3. 实用且免费API接口2

    之前已经整理过一些免费API,现在在知乎专栏上看到别人整理的一些实用免费API,有一些是没有重复的,因此也搬过来. 今天的内容,很适合你去做一些好玩.实用的东西出来. 先来科普个概念,开放应用程序的A ...

  4. python 使用API调用和风天气获取天气情况并保存

    第一步.注册注册免费API和阅读技术文档: 注册地址:https://console.heweather.com 注册完成后,激活登录后,新建应用 .新建key KEY名称 密钥ID 密钥 类型下载城 ...

  5. 车型识别API调用与批量分类车辆图片

    版权声明:本文为博主原创文章,转载 请注明出处 https://blog.csdn.net/sc2079/article/details/82189824 9月9日更:博客资源下载:链接: https ...

  6. Java web与web gis学习笔记（二）——百度地图API调用

    系列链接: Java web与web gis学习笔记(一)--Tomcat环境搭建 Java web与web gis学习笔记(二)--百度地图API调用 JavaWeb和WebGIS学习笔记(三)-- ...

  7. Vue.js——使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用

    概述 上一篇我们介绍了如何使用vue resource处理HTTP请求,结合服务端的REST API,就能够很容易地构建一个增删查改应用.这个应用始终遗留了一个问题,Web App在访问REST AP ...

  8. 信鸽推送 .NET (C#) 服务端 SDK rest api 调用库(v1.2)

    信鸽推送 .NET  服务端 SDK rest api 调用库-介绍 该版本是基于信鸽推送v2版本的时候封装的,先拿出来与大家分享,封装还还凑合,不依赖其他http调用件,唯一依赖json序列化dll ...

  9. xmlrpc实现bugzilla api调用（无会话保持功能，单一接口请求）

    xmlrpc实现bugzilla4   xmlrpc api调用(无会话保持功能,单一接口请求),如需会话保持,请参考我的另外一篇随笔(bugzilla4的xmlrpc接口api调用实现分享: xml ...

随机推荐

  1. 在一个div上增加遮罩

    有一个需求是给一个视频增加遮罩 我研究了下 抽象出来就是给一个div增加遮罩 原理是:最外层的div使用relative定位     然后里面放两个子div  一个是不被遮的  另一个是遮罩(用abs ...

  2. web前端 在react中使用移动端事件,学习笔记

    一  移动端事件的使用:           onTouchStartCapture        onTouchStart           onTouchMoveCapture       on ...

  3. DAO层单元测试编码和问题排查

    DAO层单元测试编码和问题排查 SecKillDaoTest .java(注意接口参数使用注解@Parm(“parameter”)) package org.secKill.dao; import o ...

  4. 后端技术杂谈11：十分钟理解Kubernetes核心概念

    本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到我的仓库里查看 本文转自 https://github.com/h2pl/Java-Tutorial 喜欢的 ...

  5. AtCoder Regular Contest 071 D - 井井井 / ###

    题目:http://arc071.contest.atcoder.jp/tasks/arc071_b 题意: 有一个二维的平面,给你xn根竖线和ym根横线,问这些线围成的长方形(正方形)的面积和(要求 ...

  6. php的URL查询字符串解析函数

    URL查询字符串格式:Data[650][BLN]=40002307312&Data[650][Status]=電聯無人接聽. 解析这种数据使用函数:parse_str(). parse_st ...

  7. 生产环境下，oracle不同用户间的数据迁移。第一部分

    :任务名称:生产环境下schema ELON数据迁移至schema TIAN ######################################## 测试一:测试参数 数据泵数据导出:exp ...

  8. openstack——glance镜像服务

    一.glance介绍:                Glance是Openstack项目中负责镜像管理的模块,其功能包括虚拟机镜像的查找.注册和检索等. Glance提供Restful API可以查 ...

  9. Vue过滤器：全局过滤器

    Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化. 过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持). 过滤器应该被添加在 JavaScr ...

  10. C#计算两个日期的相隔天数

    DateTime start = Convert.ToDateTime(dateStart.ToShortDateString()); DateTime end = Convert.ToDateTim ...