复习-前端05

目录

jQuery时代  

前后端分离

---

 ----------------------------jQuery时代----------------------------  

    HTML：网页结构    
    css：美化网页
    JavaScript：给网页增加交互效果
        盒子模型：标签之间的相互嵌套，通过内外边距控制盒子的所在位置，从而达到我们想要的布局效果
        定位：绝对定位、相对定位    （脱离文档流）
        偏移：
    JQuery：简化js对网页的操作，是js库
        之前：document.getElementById("id");
        之后：$("#id");
        常用的：
            选择器：类、标签、id、*、子代 div table、层级 div>table、伪类 :checkbox
            html/text/each/append/siblings...
            ajax：url/data/datatype/success/async
                <!-- 
                    c table 能命中table，给table标签添加样式，不管中间隔了多少层级，只要里面有，那就能够选的中
                    d > table 不能，只有儿子是对应的标签，才能够选的中
                -->
              

 <div class="c">
                    <div class="d">
                            <table border="" cellspacing="" cellpadding="">
                                <tr><th>Header</th></tr>
                                <tr><td>Data</td></tr>
                            </table>
                    </div>
                </div>

    bootstrap：前端框架，能够快速进行网页布局，偏向前台开发
        栅格布局-响应式
    easyui：前端框架，快速搭建动态的管理界面，偏向后台开发
        layout：布局
        tree：左侧菜单
        tabs：选项卡
        datagrid：数据表格
        dialog：模态框
        form：对于表单进行ajax操作

    ----------------------------前后端分离-------------------------------

    vue：渐进式框架
    ElementUI：基于vue的前台框架，里面封装了大量的vue组件
        生命周期/钩子函数：beforeCreate、created、beforeMount、mounted
            beforeUpdate、updated、beforedestory、destoryed
        默认会执行的函数：
            beforeCreate、created、beforeMount、mounted
        常用指令：
            v-model、v-on:事件名(@事件名)、v-bind:属性名（:属性）
            v-if/v-show/v-for
        路由：做跳转，jsp是页面跳页面，vue是组件跳组件
            原理是HTML中的锚点
            vue中，定义锚点， <router-view></router-view> 
                    定义跳转， <router-link to="/home">go to Home</router-link>
                    let routes=[{abortme:"/me"},{home:"/home"}]
                    进行挂载 new vue({router})
        nodejs:前端运行环境，它就相当于后台中的tomcat
        npm:相当于后台中的maven，maven是用来构建项目，管理工程中的jar包
            管理前台的js依赖的
        Vuex：管理整个vue项目的变量的
            store.js 存储变量
            mutations.js 同步改变存储中的变量值
            actions.js 异步改变存储中的变量值
            Getter.js 获取存储中变量值
        jwt
            关于token令牌的解决方案
            之前：数据是存储在session中
            之后：前后端分离，用户数据存储在session中没有意义，前后端分离
            是跨服务器的；jwt通过request请求头，响应头的方式，管理数据