项目笔记-前端知识总结

面向浏览器：

---

一、语言：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 给服务器