面向浏览器:
一、语言:HTML(框架)、CSS(样式)、JavaScript(行为)
1、HTML:包含标签、属性
2、CSS:包含选择器、样式
3、JS:
(1)DOM:dom语法
(2)BOM:Window
(3)ECMAScript:js基础语法
(4)模块封装:
1)沙箱:对外暴露访问方式
2)异步加载:script标签中加上 async属性
3)AMD:require.js
二、前后端数据交互:刷新页面发送 与 不刷新页面发送
1、刷新页面发送
(1)form表单:
包含action / method / input name / input submit / input file / enctype
(2)a 标签
(3)window.location = “......”
2、无刷新页面发送
(1)ajax 手写 / JQ
1)手写:
1.创建对象
2.设置请求行
3.设置请求头
4.设置回调函数——请求回来
5.设置请求主体——请求发送
2)JQ:$_GET / $_POST
1. $_GET:url / data / success
2. $_POST:url / data / success
(2)ajax 2.0
1)仅支持IE10及以上
2)FormData : 如果form表单中没有数据 / append
3)结合JQ需要设置:contentType:false ;processData:false
三、跨域资源访问 :不同源站点请求数据
(1) 同源 / 不同源
1) 同源:地址、端口、协议都一致
2)不同源:地址、端口、协议不全一致
(2)跨域方案:
1)CORS:跟前端无关,需后端设置header
2)JSONP:需前后端配合
原理:
1.script 标签的 src 属性 支持跨域访问
2.发送了一个函数名去服务器 callback
3.服务器返回了一个函数的 调用 ,拼接了数据在里面
3)JQ使用:
1. $.get( ) 调用接口
2. dataType:"jsonp" 设置数据类型是 jsonp 给服务器