后台开发与前端开发
后台转前端开发还是测试
前端开发 后台
1.load方法:
jq中用来请求静态文件的方法,如请求
//load方法筛选请求内容:在url之后添加要加载的标签的标志,标志可以是tag\id\class,之间使用空格隔开,这样就只能加载到指定的数据
$('#news').load('news.html h3');
});
2.get()方法
$(‘button’).click(function () {
//.get()用来向服务器发起get请求
//第一个参数是请求路径,必选,其他选选
//第二个参数是对象类型的数据,把需要提交给服务器的参数放在这个对象中
//第三个参数是载入成功时回调函数,通过这个回调函数拿到请求的值,只有请求成功才会调用
//第四个参数type:服务器返回数据的类型,如果我们需要请求的服务器给我们返回的是json数据,则这个参数只能写json,尽量不要给这个参数
$.get(‘test.json’,{name:”fang”}, function (data) {
//通过data参数拿到请求到的值
alert(data)
//数据提取并拼接在文档中
},’json’);
//.post()方法用来发起post请求,当服务器只能接收post请求时,使用该方法,该方法的用法和参数情况和.get完全一样
$.post();
});
3.getJson()方法
//getJSON():使用get方式获取json文件
//第一个参数url:请求的数据接口
//第二参数callback:请求成功的回调函数,通过这个函数的参数获取到服务器返回的值
$.getJSON(‘http://10.0.159.198/news.php?callbackFun=?’, function (data) {
});
//如何跨域? callbackFun这个名字由服务器定,后面跟问号即可
//只需要在url后拼接上回调函数的属性名和属性值即可,属性名由后台人员指定,属性的值可以是一个“?”,而且必须是问号,因为jq只认识问号,jq会自动把这个?转化为回调函数的函数名
$.getJSON('http://10.0.159.198/news.php?callbackFun=?', function (data) {
console.log(data);
console.log(data.age);
console.log(data.name);
console.log(data.gender);
});
4.使用$.ajax()实现跨域请求
$.ajax({
//url参数必填,表示数据接口
url:'http://10.0.159.198/news.php',
//type参数可选请求方式大小写无所谓
//GET:1.参数拼接在URL之后2.参数的大小有限制,限制在2k,因为服务器端口最多只能接收2k字节的数据3.用GET发起的请求数据会在浏览器中缓存
//POST:1.参数存放在请求头中2.传递的参数大小没有限制3.浏览器不会缓存post数据
type:'GET',
//dataType,服务器返回的数据格式,json是数据格式,jsonp是一种数据形式,他俩没有可比性
//dataType,表示希望服务器返回的数据类型,必填
//jsonp这种类型的数据格式只存在jq中
dataType:'jsonp',
//jsonp:表示传递给服务器时回调函数名字值的属性名,必填
jsonp:'callbackFun',
//data:传递参数以及回调函数,回调函数的属性名要和jsonp中指定的一致,而回调函数的值用问号去表示
data:'callbackFun=?',
//success:可选的,表示请求成功的回调函数
success: function (data) {//缺点:一个成功状态只能绑定一个函数
alert(data.name);
},
//error:可选的,表示请求失败的回调函数
error: function (err) {
console.log(err);
}
});
5.$.ajax()方法
$.ajax({
//url参数必填,表示数据接口
url:’test.json’,
//type参数可选请求方式大小写无所谓
//GET:1.参数拼接在URL之后2.参数的大小有限制,限制在2k,因为服务器端口最多只能接收2k字节的数据3.用GET发起的请求数据会在浏览器中缓存
//POST:1.参数存放在请求头中2.传递的参数大小没有限制3.浏览器不会缓存post数据
type:’GET’,
//data参数可选,把需要提交给服务器的参数用&符号连接起来
data:”user=123&pass=123″,
//success:可选的,表示请求成功的回调函数
success: function (data) {
console.log(data);
},
//error:可选的,表示请求失败的回调函数
error: function (err) {
console.log(err);
},
//timeout:可选的,设置请求超时时间,一般很少用
timeout:1000
});
6.初步接触promise()
1.什么是promise()?
promise对象用来进行延迟和异步计算,执行完$ajax()后会返回一个对象,用变量接收这个变量后,可以把不同状态的回调函数添加在这个对象上
2.为什么要使用promise?
使用promise可以为服务器的某个状态添加多个回调函数
3.如何使用promise?
.done\fail\always当数据请求成功、失败、成功失败后会执行对应的方法并把数据、错误传递进回调函数
实例:.$.ajax()执行完毕会返回一个请求对象
var pro = $.ajax({
url:”test.json”,
type:”GET”,
});
//.done()表示请求成功执行的方法
pro.done(function (data) {
alert(data);
});
pro.done(function () {
alert("ok");
});
//.fail()表示请求失败执行的方法
pro.fail(function () {
alert("fail");
});
pro.fail(function () {
alert("fail fail");
});
//.always()无论请求成功还是失败都会调用这个方法
pro.always(function () {
alert("always");
});
//以上三种状态可以绑定任意种回调函数,可以用来减轻一个函数里面的代码量,一种状态指定多个操作,降低传参的压力
//promise用链式语法添加
pro.done(function(data){alert(data);}).fail(function () {
alert('链式语法失败')
}).always(function () {
alert('链式语法总是');
});
——————————html复习—————————————-
1./把背景图像扩展至足够大,以使背景图像完全覆盖背景区域。/
background-size: cover;
2.图片垂直居中可以使用vertical-align: middle;
3.文本输入框点击、按钮点击去掉默认的边框添加自己喜欢的边框
input:focus{
/清除自带的边框颜色/
outline: none;
/重设边框颜色/
border-color: red;
/设置边框阴影,x\y设为零,上下左右都会有阴影/
box-shadow: 0 0 5px yellow;
}
4.按钮会自带一些边框,可以用重写的方法去掉
/去掉自带的边框/
border: 0px;
后台开发属于前端吗
前端界面和后台开发界面
我是后台开发转前端好转嘛