前端开发者| 前端开发框架选型 |
| node.js前端开发框架教程集锦 |
| vue 前端框架 开发者 |
html 代码
<!DOCTYPE html>
<html>
<head lang=”en”>
<meta charset=”UTF-8″>
<title></title>
<style type=”text/css”>
* {
margin: 0;
padding: 0;
}
#weather {
width: 800px;
height: 500px;
margin: 0 auto;
}
.div {
width: 150px;
height: 200px;
background: deepskyblue;
display: inline-block;
line-height: 33px;
text-align: center;
}
</style>
</head>
<body>
<div id=”weather”>
<div class=”div”></div>
<div class=”div”></div>
<div class=”div”></div>
<div class=”div”></div>
<div class=”div”></div>
</div>
<script type=”text/javascript”>
/**
* Created by Administrator on 2016/9/3.
*/
function ajaxFun(obj) {
//1.创建请求对象
var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject(“Microsoft.XMLHTTP”);
//2.判断请求方法
var method = obj.method.toUpperCase();
if (method == “GET”) {
xhr.open(method, obj.url + “?” + obj.data, true);
xhr.send(null);
} else if (method == “POST”) {
xhr.open(method, obj.url, true);
xhr.send(obj.data);
} else {
console.error(“请求方式有误，请选择get/post中的一种”);
}
//3.监听服务器返回事件
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
if (xhr.status >= 200 && xhr.status < 300) {
obj.successFun(xhr.responseText);
} else {
obj.failFun(“请求数据失败”);
console.warn(xhr.status);
}
}
};
}
var divs = document.getElementsByClassName(“div”);
var obj = {
method: “Get”,
url: “http://wthrcdn.etouch.cn/weather_mini?city=北京”,
data: “”,
successFun: successFun,
failFun: failFun
};
ajaxFun(obj);
function successFun(data) {
var resultObj = JSON.parse(data).data;
var forecastArray = resultObj.forecast;
for (var i in forecastArray) {
var array = forecastArray[i];
divs[i].innerHTML = array.date + “<br>” + array.type + “<br>” + array.high + “<br>” + array.low + “<br>” + array.fengli + “<br>” + array.fengxiang;
}
}
function failFun(data) {
alert(data);
}
</script>
</body>
</html>
| ie8支持的前端开发框架 |
| 钉钉开发前端框架 |
| pc 前端开发框架 |
970106_lzh 2年前 (2021-01-08)说：
huihui 3年前 (2020-10-20)说：
Satisfy 3年前 (2020-06-05)说：
评论前必须登录！
注册