html页面开发
2020-05-15 本文已影响0人
zlf_j
ajax请求（jquery或者原生）
- 表头警告：Provisional headers are shown
或者报错：Access to XMLHttpRequest at 'http://127.0.0.1:8082/api/photo' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
解决：跨域问题，需要后台解决 - 500 (Internal Server Error)
解决：参数类型错误，应该传json，而不是对象
JSON.stringify(obj)
https://blog.csdn.net/blackcat88/article/details/90490090 - Uncaught (in promise) DOMException: Failed to execute 'open' on 'XMLHttpRequest': Invalid URL（无效的url）
解决：url前面一定要加http://
https://blog.csdn.net/slyslyme/article/details/83027660
https://www.cnblogs.com/fxwoniu/p/11589287.html - 接口联调地址
服务器的IP地址+服务器运行端口+接口路径（向后台确认） - 局域网下（两台电脑，在同一无线网络下）
后台电脑的IP+端口+接口路径
jquery2.2.1.min.js下载
http://www.veryhuo.com/down/html/80760.html#download
jquery请求ajax
<script>
$(function() {
$.ajax({
url: " https://xx.php",
type: "post",
data: JSON.stringify({count:5}),
dataType: 'json',
success: function (res) {
if (res.status == 1) {
}
}
})
})
</script>
https://blog.csdn.net/AK852369/article/details/94835290
原生js请求ajax（封装）
window.onload = function() {
//测试调用
var sendData = {
type: 0
}
Ajax('post', 'http://127.0.0.1:8080/api/photo', sendData, function(data) {
console.log(data);
}, function(error) {
console.log('error' + error);
})
}
//封装的ajaxPost函数
//五个参数 type:GET/POST, url:请求地址，data:请求的数据，success:成功的回调函数
// failed:失败的回调函数
function Ajax(type, url, data, success, failed) {
//创建ajax对象
var xhr = null,
random = Math.random(),
type = type.toUpperCase();
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject('Microsoft.XMLHTTP');
}
if (typeof data == 'object') {
var str = '';
for (var key in data) {
str += key + '=' + data[key] + '&';
}
console.log(str); //name=zlz&sex=female&
data = str.replace(/&$/, '');
console.log(data); //name=zlz&sex=female
}
if (type == 'GET') {
if (data) {
xhr.open('GET', url + '?' + data, true);
} else {
xhr.open('GET', url + '?t=' + random, true);
}
xhr.send();
} else if (type == 'POST') {
xhr.open('POST', url, true);
//如果需要像html表单那样 post数据，请使用 setRequestHeader() 来添加http头
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(data);
}
//处理返回数据
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
success(xhr.responseText);
} else {
if (failed) {
failed(xhr.status);
}
}
}
}
}
https://www.cnblogs.com/Webcom/p/3415295.html
- JS - 将数组格式的字符串转换成数组
var str = '["a", "b", "c", "d"]';
var arr = eval('(' + str + ')');
console.log("原始的字符串：", str);
console.log("转换后的数组：", arr);
console.log("数组第一个值：", arr[0]);
https://www.hangge.com/blog/cache/detail_2243.html
-
html中直接用vue.js
https://jingyan.baidu.com/article/e4d08ffd7340c90fd2f60d9a.html -
vue.js 文件下载地址
https://cn.vuejs.org/v2/guide/installation.html -
jquery-2.1.1.min.js:4 Uncaught (in promise) TypeError: Illegal invocation
jquery非法调用
参数格式问题
data: JSON.stringify({
id: id,
type: 3,
url: url
})
https://cloud.tencent.com/developer/ask/38215
- 循环中加延时
<script>
for(let a =0;a<data.length;a++){
setTimeout(function() { console.log(1); }, a*1000);
}
</script>
html2canvas截图功能
图片截图失败：
是跨域问题，需要在跨域的服务器上设置header设置为允许跨域请求（后台调）
https://blog.csdn.net/yaosir1993/article/details/76474080
截图不全：
https://segmentfault.com/q/1010000021932983/
