聊天
1、为什么你们现在开发这么缓慢?
1、不够熟悉 - 解决:多敲多练,猛肝自然强
2、我们目前学习的所有的东西都需要自己纯手敲,我们学的都是原生的东西 - 最值钱
2、我们需要有各种各样的框架,目的:来简化开发
主要是三阶段:vue.js+react.js(2个8周)+uniapp+小程序
底层就是原生JavaScript,一定进行了简化开发,比如:vue和react提供了虚拟DOM
当今社会最流行的3大框架:
vue.js(国人自己开发,鱿鱼须开发的,借鉴了react和angular,三大框架中最简单,10家公司7家都要)
react.js(如果你的原生JS学的越好,这个就越简单)
angular.js(北上广深杭:10家公司没有一家,重庆:20家没有一家,国外很多)
jquery框架:3大框架出现之前,全球最流行的,只有一些老项目可能用到:淘宝
我们目前要学的:简单的插件库+express框架(node.js的框架)
1、jQueryUI框架
jQueryUI框架:呆老师更爱称呼他是一个组件/插件库:基于Jquery的开源网页用户界面代码库 - 没必要学习jQuery,jQuery已经淘汰了,而且jQueryUI非常简单:提供了HTML/CSS/JS,你做的最多的一件事,复制粘贴
组件:组成网页一部分的部件(导航条、banner...);
插件:根组件差不多,但是带有生命JS(轮播、选项卡...);
在三大主流框架出现之前,jQuery就是全球最火的,从06-15年都是全最火的
三大框架:vue.js、react.js、angular.js(三阶段不学,中国市场用的少,北上广深杭10家用不到一家,重庆就更拉)
如何使用:不需要记忆
1、打开jQueryUI中文网
2、下载jQueryUI插件库,引入到你的项目之中:
<link rel="stylesheet" type="text/css" href="jquery-ui-1.13.2.custom/jquery-ui.css"/>
<script src="jquery-ui-1.13.2.custom/external/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery-ui-1.13.2.custom/jquery-ui.js" type="text/javascript" charset="utf-8"></script>
3、挑选你喜欢的组件/插件:
个人推荐:
1、标签页/选项卡
2、菜单
3、折叠面板/手风琴
4、自动完成/模糊搜索
5、特效:$( "#div" ).toggle( "特效名称", 动画的时长 );
6、其余的特效可以自行玩玩
4、源代码可以复制过来:HTML+CSS+JS
5、根据设计图修改样式 - 如果你改了样式发现没生效,一定是因为优先级权重不够
6、使用ajax去获取数据库中的数据,然后来渲染此插件,最后再去调用jQueryUI提供的JS代码
2、layUI.js组件/插件库/框架:
使用方式几乎和jQueryUI一致:下载、引入、查看示例DEMO,但是比jQueryUI更漂亮
1、日期选择器
2、轮播
3、网站:jQuery插件库(登陆账号,一天可以免费下载两次) 和 jQuery之家(免费)
下载后解压,里面放着HTML和CSS和JS,复制到你的项目即可
简单的插件库:
1、日期插件:
1、wdatepicker.js:- 丑
1、下载引入:<script src="My97DatePicker/WdatePicker.js" type="text/javascript" charset="utf-8"></script>
2、书写js:
inp.onfocus=function(){
WdatePicker({
el:"inp",//el -> element 你的日期选择器选择的元素是哪个
//更多的键值对可以看源代码
})
}
2、layUI.js - 插件库:提供了HTML/CSS/JS,那我们只需要下载,梭代码
组件:组成网页一部分的部件(比如:导航条...)
插件:跟组件差不多,但是有js功能(比如:轮播、选项卡...)
框架:包含各个方面
插件的固定使用步骤:
1、引入该引入的
2、选择你喜欢的梭到你的项目中
3、根据设计图修改css
4、ajax那数据进行渲染
客户端存储技术:3个
1、url网址后面可以跟着一个查询字符串,缺点:仅仅适合两个页面之间互传,但是不适合多页面传递
2、cookie:缺点:只能保存2kb,操作麻烦
3、webStorage:优点:大小8mb,操作非常简单:两部分
1、sessionStorage - 会话级:一旦关闭浏览器数据就死亡了 !
2、localStorage - 本地级:只要不删除不清空,永远存在!
这两个对象都是不用我们创建的,浏览器自带
存储:xxxStorage.属性名=属性值;
获取:xxxStorage.属性名;
删除:xxxStorage.removeItem("属性名"); - 只能删一个
清空:xxxStorage.clear();