Web前端基础知识
文章平均质量分 86
Jyan_29
这个作者很懒,什么都没留下…
展开
-
vue进阶学习
vue1 原生事件绑定到组件此篇主要是个人对vue教程上第一遍未吃透的概念的理解1 原生事件绑定到组件在 Vue 中,对于原生元素(<div>、<button> 等)只能监听原生事件(也就是 HTMLElement.addEventListener() 实现的效果);而对于 Vue 自定义组件,默认只能监听那个组件主动 $emit() 出来的自定义事件。而使用nat...原创 2019-06-14 15:48:38 · 773 阅读 · 0 评论 -
Vue_4.
Vue1 SPA2 Vue-router组件3 脚手架1 SPASPA:Single Page Application,整个应用程序只有一个完整的HTML页面和多个保存不同&amp;quot;页面&amp;quot;内容的组件片段。SPA应用侦测地址栏中相对路径的变化,选择匹配的组件片段替换唯一HTML文件中的相应区域。1)请求次数:单页面应用只在首次加载时请求一次,将一个完整的HTML页面和多个片段都获取到客户端保存。每次...原创 2019-01-28 11:40:38 · 163 阅读 · 0 评论 -
Vue_3
Vue1 组件2 组件生命周期3 组件化开发4 组件间传参5 路由1 组件拥有专属的HTML,CSS和数据的页面独立区域。优点:便于重用、松散耦合、分工协作页面由一个个独立的区域组成,封装为组件。即每个页面由多个组件组成1.创建Vue组件:1.1先在&amp;amp;amp;amp;lt;template&amp;amp;amp;amp;gt;&amp;amp;amp;amp;lt;/template&amp;amp;a原创 2019-01-23 20:45:53 · 1832 阅读 · 0 评论 -
JS_core_1.RegExp,Function
正则表达式&amp;函数1 正则表达式RegExp1.1 概述1.2 定义1.3 RegExp对象1.4 模式匹配1.4.1 查找关键词1.4.2 替换1.4.3 切割2 函数Function2.1 Function对象2.2 闭包2.2.1 匿名函数2.2.2 作用域和作用域链2.2.3 闭包1 正则表达式RegExp1.1 概述Regular Expression:由普通字符和特殊字符组...原创 2019-01-03 20:15:37 · 124 阅读 · 0 评论 -
jQuery_2
jQuery1 插件/组件2 ajax3 跨域1 插件/组件插件/组件:拥有专属的HTML,CSS,JS的页面独立区域(重用)三个来源:jquery ui1.引入jQuery.js2.再引入jquery-ui.css 和 jquery-ui.js3.按插件要求编写HTML4.找到插件的父元素,调用插件API:第三方插件自定义插件2 ajax3 跨域...原创 2019-01-17 19:51:20 · 160 阅读 · 0 评论 -
JS_core_2.JavaScript OOP原型与继承
面向对象1 面向对象OOP1.1 面向对象1.2 封装1.3 继承1.4 多态2 原型与继承1 面向对象OOP1.1 面向对象对象:程序描述现实中一个具体事物的属性和功能的程序结构。事物的属性会成为对象的属性,事物的功能会成为对象的方法。面向对象编程: 程序都是先将数据和功能定义在对象中,再按需使用对象的数据和功能优点:便于大量数据和功能的维护和使用特点:封装、继承、多态1.2 封装...原创 2019-01-05 10:24:27 · 402 阅读 · 0 评论 -
Bootstrap_2.组件
组件1 常用组件1 常用组件下拉菜单下拉菜单的三级结构:&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;div class=&amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;dropdown&amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;gt;原创 2018-12-20 17:57:23 · 228 阅读 · 0 评论 -
Bootstrap_3.SCSS、Bootstrap定制
SCSS、Bootstrap定制1 SCSS1.1 动态语言概述1.2 SCSS定义2 Bootstrap定制Bootstrap重点:媒体查询技术+栅格布局+SCSS1 SCSS1.1 动态语言概述CSS缺点:语法不够强大,没有变量和合理的样式复用机制;逻辑上相关的属性值必须以字母的形式重复输出;难以维护;动态样式语言为css赋予动态语言的特性,极大的提高了样式语言的可维护性...原创 2018-12-21 19:46:32 · 865 阅读 · 0 评论 -
NPM模块 Webpack的使用
Webpack的使用1 NPM的扩展使用2 模块的使用3 Webpack的使用1 NPM的扩展使用npm init:初始化Node.js项目,创建必需的package.json文件npm init -y:创建必需的package.json文件(按默认方式)npm help install:查看package.json文件中可用的所有条目npm install xxx:安装指定的依赖模块...原创 2018-12-26 19:43:39 · 1513 阅读 · 2 评论 -
Bootstrap_1.响应式网页、Bootstrap、全局CSS样式
响应式网页、Bootstrap、全局CSS样式1 响应式网页1.1 概述1.2 测试响应式网页1.3 编写响应式网页2 Bootstrap2.1 Bootstrap2.1.1 Bootstrap定义2.1.2 目录说明2.1.2 模板2.1.3 相关技术2.3 bootstrap.css2.3.1 CSS Reset2.3.2 box-sizing3 全局CSS样式3.1 全局CSS样式3.2 栅...原创 2018-12-11 11:09:46 · 1611 阅读 · 0 评论 -
CSS3CORE_2.转换、过渡、动画、CSS优化
转换、过渡、动画、CSS优化1 转换1.1 转换简介1.2 2D转换1.3 3D转换2 过渡2.1 过渡概述2.2 过渡属性3 动画3.1 动画概述3.2 关键帧3.3 动画属性4 CSS优化1 转换1.1 转换简介转换定义使元素改变形状、尺寸和位置的效果,可以对元素应用2D或3D转换进行旋转、缩放、移动或倾斜;(改变元素在页面中的位置、大小、角度和形状)2D转换:使元素在X轴和Y轴平...原创 2018-12-09 23:31:26 · 323 阅读 · 0 评论 -
HTTP&AJAX_3.JSON、XML语法、解析
XML语法、XML解析、JSON1 JSON1.1 JSON概述1.2 JSON的使用1.2.1 JSON对象1.2.2 JSON数组1.2.3 JSON文档与对象的转换1.3 JSON应用2 XML语法1.1 XML概述1.2 XML语法2 XML解析1 JSON1.1 JSON概述1.2 JSON的使用1.2.1 JSON对象1.2.2 JSON数组1.2.3 JSON文档与对象的...原创 2018-12-05 15:19:58 · 269 阅读 · 0 评论 -
Vue_1
Vue1 原生/函数库/框架2 vue3 vue原理4 绑定语法5 指令(directive)1 原生/函数库/框架原生DOM/BOM是浏览器自带,比较繁琐;jQuery函数库第三方,简单,仅对四个步骤的API进行简化,没有对流程进行简化,存在大量重复操作;框架:Vue/Angular/React,框架是半成品项目,从流程上根本的简化开发,消除重复操作2 vueVue是渐进式的基于MVV...原创 2019-01-21 11:38:02 · 201 阅读 · 0 评论 -
jQuery_1
jQuery1 jQuery概述2 增删改查3 事件绑定4 动画5 ajax1 jQuery概述jQuery是第三方开发的执行DOM操作的极简的函数库。jQuery对DOM的每个操作/API进行简化,仅限于PC端2 增删改查3 事件绑定4 动画5 ajax...原创 2019-01-16 20:08:10 · 203 阅读 · 0 评论 -
vue列表渲染
vue列表渲染注意事项1 对象2 数组API3 数组响应式4 对象响应式5 过滤、排序v-for更新渲染过的元素列表,默认使用复用策略,这个默认的模式是高效的,但是只适用于不依赖子组件状态或临时 DOM 状态 (例如:表单输入值) 的列表渲染输出1 对象迭代对象属性有三个参数,value, name, index2 数组API使用数组的变异方法改变数组触发视图更新;使用非变异方法返回一...原创 2019-05-06 12:26:33 · 650 阅读 · 0 评论 -
项目常见需求
项目需求1 vue移动端长按原生事件2 css3加载loading图标1 vue移动端长按原生事件https://my.oschina.net/u/2393989/blog/8419022 css3加载loading图标https://blog.csdn.net/Maci_yera/article/details/77612209...原创 2019-04-04 16:40:56 · 677 阅读 · 0 评论 -
Angular_2.路由、移动端ionic
Angular1 路由1.1 配置1.2 基础用法1.3 跳转传参1.4 路由嵌套(routerOutlet/children)1.5 路由守卫1 路由建立映射关系,能更快地实现SPA单页面应用程序1.1 配置1)将路由功能单独的封装在一个模块ng g module route --routing修改 route.routing.module.ts中forChild–&amp;amp;amp;gt;forRo...原创 2019-03-18 21:10:15 · 851 阅读 · 0 评论 -
Angular_1.语法、管道、组件、服务、http
Angular1 Vue1.1 Vue及其技术栈(生态圈)1.2 vue基础语法1.3 vue组件1.4 vue组件通信1.5 服务器端通信1.6 路由1.7 vuex2 设计原则3 Angularvue开源组件库:https://github.com/vuejs/awesome-vueangular开源组件库:https://github.com/PatrickJS/awesome-an...原创 2019-03-05 21:05:56 · 1575 阅读 · 0 评论 -
混编、UI组件库
混编phonegap1 phonegap2 pc端UI组件库1 phonegapphonegap本身是一个开发平台,提供让js开发者直接调用手机底层硬件的功能。将程序上传至phonegap网站会自动打包程序生成app国内中文phonegap网站:http://www.phonegap100.com/官方网站:http://docs.phonegap.com/硬件设备device.pl...原创 2019-03-04 17:43:35 · 233 阅读 · 0 评论 -
VUE_UI_2.组件跳转、传参、vuex
组件跳转、传参1 组件间跳转及传参2 示例1 组件间跳转及传参(1)标签方式跳转(优先选) &amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;router-link to=&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;组件路径&amp;amp;amp;amp;amp;amp;amp;amp原创 2019-02-14 16:20:51 · 638 阅读 · 0 评论 -
WeChat小程序
微信小程序1 微信公众平台2 微信小程序1 微信公众平台腾讯: 微信通讯(9亿用户群) 张小龙-微信公众平台-(订阅号)-[电视台;报纸;杂志]-微信公众平台-(小程序)-[小程序] pc/android/ios-微店-微信公众平台-(小游戏)2 微信小程序小程序特点:不需要下载即可使用,用完即走.小程序发布时候对软件要求项目最大1MB,升级有2MB微信公众平台–注册帐户 ...原创 2019-02-27 21:23:16 · 1116 阅读 · 0 评论 -
HTML5_Core.十大新特性
HTML5_CORE1 增强型表单1.1 新的input type1.2 新元素element1.3 新属性attr2 视频音频2.1 视频video2.2 音频audio3 Canvas绘图3.1 绘图概述3.2 canvas绘图画布3.3 canvas绘图文本4 SVG绘图5 地理定位6 拖放API7 Web Worker8 Web Storage9 Web Socket10 语义标签1 增...原创 2019-02-18 21:14:39 · 919 阅读 · 0 评论 -
VUE_UI.UI组件和CLI脚手架
VUE_UI1 vue ui 组件1.1 mint-ui安装与使用1.2 mint-ui组件分类1.3 mint-ui组件1.3.1 Toast提示框1.3.2 lazyLoad懒加载1.3.3 mt-swipe轮播图2 vue cli 脚手架1 vue ui 组件pc端与移动端区别:屏幕宽度992px、操作方式基于VUE框架开发移动端组件库Mint-UI、MUI(dev.dcloud.cn...原创 2019-02-13 09:38:35 · 584 阅读 · 0 评论 -
Vue_2
Vue1 双向绑定2 绑定class和style属性3 计算属性4 自定义指令5 过滤器6 Axios1 双向绑定:value的方式只能将内存中模型变量的值绑定到页面,不能将页面的修改自动同步到内存中的模型变量上——单向绑定双向绑定: 既能将内存中模型变量的值绑定到页面,又能将页面的修改自动同步到内存中的模型变量上。v-model用于绑定可修改的表单元素v-model:value=”模型...原创 2019-01-22 19:37:15 · 163 阅读 · 0 评论 -
CSS3CORE_1.复杂选择器、内容生成、弹性布局、CSSHack
CSS31. 复杂选择器1.1 兄弟选择器1.2 属性选择器1.3 伪类选择器1.4 伪元素选择器2. 内容生成3. 弹性布局4. CSS Hack1. 复杂选择器1.1 兄弟选择器相邻兄弟选择器通用兄弟选择器1.2 属性选择器1.3 伪类选择器目标伪类结构伪类否定伪类1.4 伪元素选择器:first-letter:first-line::selection...原创 2018-12-07 10:03:58 · 419 阅读 · 0 评论 -
CSS3_3.文本格式化&表格&浮动
文本格式化、表格、浮动1 文本格式化1.1 文本格式化概述1.2 字体属性1.2.1 控制字体1.2.2 字体属性font2 表格3 浮动1 文本格式化1.1 文本格式化概述1.2 字体属性1.2.1 控制字体1.2.2 字体属性font2 表格3 浮动...原创 2018-11-28 17:09:30 · 916 阅读 · 2 评论 -
JS_7.数组
数组1.概述2.数组定义和初始化3.访问数组1.概述程序 = 数据 + 算法;数据结构2.数组定义和初始化3.访问数组原创 2018-11-06 12:15:17 · 192 阅读 · 0 评论 -
JS_5.函数、6.对象
函数 &amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; 对象函数1)定义函数(Function),也称为方法(Method)、过程(Procedure),是一段预定义好、可以被反复使用的代码块,包含多条可执行语句,本质上是功能完整的对象。定义:function func_name() {st1;st2;…}参数:function fu原创 2018-11-05 15:38:58 · 255 阅读 · 0 评论 -
JS_8.对象
String &amp;amp;amp;amp;amp;amp;amp;amp;amp;&amp;amp;amp;amp;amp;amp;amp;amp;amp; Math1.String1.1 String概述1.2 字符串常用操作1.3 模式匹配2.Math2.1 Math对象1.String1.1 String概述包装类型指专门封装原始数据类型的数据,并提供对数据常用操作的内置引用类型; 包装类型使原始类型数据可以像引用类型一样拥有方法和属性;JavaScri原创 2018-11-07 19:09:42 · 147 阅读 · 0 评论 -
JS_1.基础语法
服务器端技术——JS基础1. JavaScript概述1.1 定义1.2 发展史1.3 特点2. JavaScript基础语法2.1 使用2.2 调试2.3语法规范3.变量和常量4.数据类型语言学习路线图1)背景知识:历史、现状、特点、应用领域、发展趋势2)搭建开发环境3)声明变量、常量4)数据类型5)运算符6)逻辑结构7)通用小程序8)函数和对象9)第三方库、组件、框架1...原创 2018-11-07 19:02:51 · 162 阅读 · 0 评论 -
MySQL_3.DQL详解
DQL详解简单查询基本查询select [col_name] from [table_name];select * from [table_name];别名: select [col_name] as [别名] from [table_name];关键字AS可选择省略只显示不同的值:select distinct [col_name] from [table_name];查询过程...原创 2018-11-02 13:48:05 · 496 阅读 · 0 评论 -
JS_3、4.控制结构
流程控制概述程序 = 数据 + 算法;任何程序可以通过“顺序”、“选择”、“循环”等程序逻辑组合实现;使用流程图辅助理解问题;break 跳出当前结构选择语句if语句if语句里的逻辑表达式可以是0、null、undefined、NaN、“”、0.0,自动转换成bool类型if … else …if … else if嵌套switch语句switch (表达式) {case ...原创 2018-11-05 10:08:31 · 121 阅读 · 0 评论 -
MySQL_2.中文乱码、列
DDL详解列类型概述数字类型多种数值类型:节省存储空间的同时保证能存储下足够大的数值整型1)TINYINT:微整型 1字节 -128~1272)SMALLINT: 小整型 2字节 -32768~327673)INT:整型 4字节 -2147483648~21474836474)BIGINT:大整型 8字节浮点型(M表示总有效位数,N表示小数点后有效位数)1)float(M,...原创 2018-11-01 20:23:47 · 244 阅读 · 0 评论 -
JS_2.运算符和表达式
运算符和表达式运算符算术运算(+、-、*、/、%、++、–)关系运算(&amp;amp;amp;amp;gt;、&amp;amp;amp;amp;lt;、&amp;amp;amp;amp;lt;=、&amp;amp;amp;amp;gt;=、、!= 、=、!)”== 与===的区别:==类型可以不同,转换后值相同即返回TRUE;===类型、数值都相同才为trueisNaN()函数:判断参数是否为“非数字”;NaN不等于任何值(包括N原创 2018-11-03 15:52:55 · 113 阅读 · 0 评论 -
MySQL_1.MySQL数据库
数据库服务器1.数据库服务器概述项目存储数据的方式1)内存:速度快;容量有限,非永久存储2)Excel等格式化文件:使用广泛;灵活性不足3)专用文件服务器:网络存储/云存储,可靠性高;操作复杂,信息泄露4)自定义结构文件4)数据库服务器:存取效率高,适合海量数据;操作复杂数据库种类数据库按照一定数据结构(数据的组织形式或数据之间的联系)来组织、存储数据,可以发出增删改查命令网...原创 2018-11-01 16:55:39 · 117 阅读 · 0 评论 -
Server_1.软件工程
软件工程1.软件工程概述历史定义方法2.软件生命周期(三个时期八个阶段)定义可行性研究阶段需求分析阶段概要设计阶段详细设计阶段服务器1.服务器概述定义硬件服务器软件服务器如何访问...原创 2018-10-31 21:48:41 · 127 阅读 · 0 评论 -
Node.js_2.包、NPM、Node.js核心模块
包和NPM &amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; Node.js核心模块1 包和NPM1.1 包1.1.1 CommonJS规范1.1.2 包1.1.3 包的结构1.2 NPM(node package manage)1.2原创 2018-11-15 13:00:58 · 236 阅读 · 0 评论 -
Node.js_3.Express
Express1 Express1.1 Express概述1.1.1 概述1.1.2 下载和安装1.1.3 最简Web服务器1.2 路由1.2.1 路由定义1.2.2 请求对象1.2.3 响应对象1.2.4 处理GET请求1.2.5 处理POST请求1.2.6 处理所有请求1.2.7 路由参数1.2.8 路由路径1.3 路由器1.3.1 路由器定义1.3.2 挂载路由器1 Express1.1...原创 2018-11-15 16:38:56 · 175 阅读 · 0 评论 -
Web前端基础学习笔记顺序
学习顺序1.Server2.MySQL3.JS4.Node.js5.HTML56.HTTP&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;AJAX7.CSS原创 2018-11-26 20:24:07 · 1106 阅读 · 0 评论 -
CSS3_2.框模型、背景、渐变
框模型&amp;amp;amp;amp;amp;amp;amp;背景&amp;amp;amp;amp;amp;amp;amp;渐变1 框模型1.1 框模型1.2 外边距1.2.3 简洁写法1.2.4 外边距合并1.3 内边距1.3.1 内边距定义1.3.2 内边距padding1.3.3 简洁写法2 背景2.1 概述2.2 背景属性2.2.1 背景色2.2.2 背景图片2.2.3 背景重复2.2.4 背景图片尺寸2.2.5 背景图片的固定2.2.6 背景定位2.2.7 背景属原创 2018-11-26 20:17:13 · 285 阅读 · 0 评论