![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端学习笔记
文章平均质量分 85
贾维斯Echo
这个作者很懒,什么都没留下…
展开
-
Vue-cli 与Vite 环境搭建与项目构建
官网地址:https://cli.vuejs.org/zh/Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供:通过@vue/cli实现的交互式的项目脚手架。通过@vue/cli实现的零配置原型开发。一个运行时依赖 (@vue/cli-service),该依赖:3.1 可升级;3.2 基于 webpack 构建,并带有合理的默认配置;3.3 可以通过项目内的配置文件进行配置;3.4 可以通过插件进行扩展。一个丰富的官方插件集合,集成了前端生态中最好的工具。原创 2023-08-27 15:24:37 · 1770 阅读 · 0 评论 -
node.js 最新保姆级安装教程
将npm默认的registry修改为淘宝registry, 查看当前的镜像。设置全局模块的安装路径到 “node_global” 文件夹。是最新版本, 这里选择的是稳定版本(18.17.0)1.打开下载安装的文件夹下的安装包, 双击进行安装。4.选择安装的位置 ,然后点击下一步next。点击此电脑—>点击高级—>找到电脑的环境变量。3.勾选同意协议,点击下一步next。输入Node 安装路径,最后点击确定。是大多用户使用的稳定版本,,选择你对应的平台和系统安装。点击下载好的安装包进行安装。原创 2023-07-27 22:25:15 · 441 阅读 · 0 评论 -
Vue 的 MVVM 思想
MVVM(Model-View-ViewModel)是一种用于前端开发的架构模式,它是一种事件驱动的编程方式。Model(模型):代表应用程序中的数据和业务逻辑。在Vue.js中,Model是指Vue实例中的data属性中的数据。这些数据需要在页面中显示。View(视图):是用户界面的可视部分,通常是由HTML和CSS构成。在Vue.js中,View就是模板(Template),用于显示数据。ViewModel(视图模型):是MVVM模式的核心部分,负责连接View和Model。原创 2023-06-06 00:42:57 · 317 阅读 · 0 评论 -
HTML 注释与标签
一个网页可以没有样式,可以没有交互,但是必须要有网页需要呈现的内容,而HTML作为一门标记语言,是通过各种各样的标签来标记网页内容的,所以HTML部分是整个前端的基础,我们学习HTML主要就是学习的HTML标签。标签 又称 元素,是HTML的基本组成单位。HTML标签是用尖括号< 和 >包围的关键词,用于标记网页中的不同元素。标签告诉浏览器如何显示和处理元素。如都是标签HTML中标签通常情况下是成对出现的,分为开始标签和结束标签,结束标签比开始标签多了一个。原创 2023-05-30 00:46:44 · 3520 阅读 · 0 评论 -
BOM 和 DOM
BOM 和 DOM文章目录BOM 和 DOM一、介绍BOM结构图二、BOM1. window对象2. window的子对象2.1 navigator对象2.2 history对象2.3 location对象(掌握)2.4 弹出框2.5 定时器3.小结4.练习三、DOM1. 查找标签之直接查找总结:2.间接查找代码示例:3.节点操作总结:4.获取值操作5.class、css操作6.事件6.1 什么是事件?6.2 常用事件6.3 事件之导入js的2种方式 和 绑定事件的2种方式6.4 事件之onclick实例原创 2021-05-02 22:00:21 · 1620 阅读 · 16 评论 -
JavaScript内置对象和方法
JavaScript内置对象和方法文章目录JavaScript内置对象和方法一、介绍二、自定义对象三、data对象1.基本使用2.常用方法3.数字时钟格式4.练习四、JSON对象五、RegExp正则对象常用匹配模式注意六、Math对象(了解)1.Math对象常用方法2.常用方法示例七、Windows对象global 对象URL编码解码一、介绍JavaScript中的所有事物都是对象:字符串、数字、数组、日期,等等。在JavaScript中,对象是拥有属性和方法的数据。我们在学习基本数据类型的时候已经原创 2021-05-02 21:01:11 · 275 阅读 · 0 评论 -
JavaScript函数
JavaScript函数文章目录JavaScript函数一、函数定义二、函数参数三、函数的返回值与表达式函数返回值return函数表达式四、匿名函数五、箭头函数六、小结七、函数全局变量与局部变量1.介绍2.示例一、函数定义用来封装你的重复性代码在python定义函数需要用到关键字def在 js 中使用 function 定义函数语法:// 语法 function [函数名](形参1,形参2,形参3...){ [函数体代码];}// 无参函数function func1()原创 2021-05-02 19:31:19 · 332 阅读 · 4 评论 -
JavaScript基本数据类型
JavaScript基本数据类型文章目录JavaScript基本数据类型一、JavaScript2种引入方式1.script内部引入2.引入外部 JS 文件二、JavaScript语言规范1.注释(代码之母)2.结束符三、变量1.声明变量声明变量的关键字: var动态语言弱类型使用var变量的声明被提前到作用域顶部,赋值则保留在原地(重点2.变量的命名规范3.ES6 新增 let 声明4.常量5.t和var定义变量的区别(重点)四、变量的5种基本数据类型1.Number : 数值类型2.String :原创 2021-05-02 17:59:14 · 424 阅读 · 2 评论 -
JavaScript简介
JavaScript简介文章目录JavaScript简介一、JavaScript是什么二、JavaScript介绍1.JavaScript故事起源及设计思想2.ECMAScript和JavaScript的关系3.ECMAScript的历史4.小结JavaScript 的组成JavaScript 的特点JavaScript 的用途三、JavaScript 语言的类型1.弱类型2.动态语言3.解释型一、JavaScript是什么JavaScript(通常在开发中简称JS来代替)是脚本编程语言,JS语言开发原创 2021-05-02 16:04:34 · 340 阅读 · 0 评论 -
uni-app入门介绍
uni-app入门介绍软件开发的时间通常是这样的:一开始的 90% 开发工作用掉了整个计划 90% 的时间,剩下的 10% 同样需要整个计划 90% 的时间,而最终发布前的修改也是如此。—— 汤姆 · 嘉吉一、引入1.为什么学习Uniapp开发?当今社会互联网技术在不断的极速发展,其中离不开每一位热情奋进的技术人员。每天层出不穷的新概念,热火朝天的区块链,泛滥的共享经济,每年蜂拥而至抢着每一手热点发布的手机厂商,还有资讯快餐充斥着我们所有能看到的场景。这一切都离不开界面的呈现,内容上、形式上、功原创 2021-05-01 22:16:47 · 1069 阅读 · 0 评论 -
vue第三方框架之ElementUi
热门组件库1 使用第三方插件https://github.com/vuejs/awesome-vue#components–libraries集合了来自社区贡献的数以千计的插件和库。2 使用第三方UI框架饿了么UED团队推出的vue 前端框架:PC框架:(element UI , iview)element UI 官网:http://element.eleme.io/element UI github:https://github.com/ElemeFE/element移动端框架:(m原创 2021-04-30 23:12:31 · 354 阅读 · 1 评论 -
VUE组件化开发
组件化开发也许根本就没有终极理论,而且即便有我们也找不到。但是努力寻求完整的理解总比对人类精神的绝望要好得多。 ——霍金《霍金讲演录》文章目录组件化开发一、组件化开发介绍1.组件是什么?有什么用?组件的分类:工程化开发之后:2.什么是组件化?人面对复杂问题的处理方式:组件化也是类似的思想:组件化定义:3.Vue组件化思想组件化是Vue.js中的重要思想组件化思想的应用:二、组件编写方式1.组件注册基本步骤2.注册组件步骤解析1.Vue.extend():2.Vue.component原创 2021-04-30 23:07:22 · 367 阅读 · 1 评论 -
Vue前后端交互
Vue前后端交互文章目录Vue前后端交互引入:Vue前后端交互一、基于jQuery的ajax前后端交互模式前端后端二、使用fetch前后端交互fetch基本用法与请求参数fetch基本用法fetch请求参数fetch前后端交互前端后端三、前后端交互之axios前端后端参考资料引入:Vue前后端交互一般在项目中结合async/await语法使用axios调用接口一、基于jQuery的ajax前后端交互模式前端<head> <meta charset="UTF-8">原创 2021-04-30 21:32:37 · 11918 阅读 · 1 评论 -
Vue生命期钩子
Vue生命期钩子一:生命周期图官网原图我理解的图二、生命周期钩子函数描述beforeCreate创建Vue实例之前调用created创建Vue实例成功后调用(可以在此处发送异步请求后端数据)beforeMount渲染DOM之前调用mounted渲染DOM之后调用beforeUpdate重新渲染之前调用(数据更新等操作时,控制DOM重新渲染)updated重新渲染完成之后调用beforeDestroy销毁之前调用dest原创 2021-04-29 00:43:24 · 258 阅读 · 1 评论 -
VUE图书购物车小案例
VUE图书购物车文章目录VUE图书购物车需求:展示图:代码:需求:展示出书籍名称出版日期、价格购买数量、前端可以书籍书籍数量最少为一本,结算出购买书籍总价展示图:代码:index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesh原创 2021-04-29 00:19:17 · 399 阅读 · 0 评论 -
Vue 入门基础
VUE基础文章目录VUE基础一、Mustache语法(模板语法)二、指令1.文本指令v-once :只渲染一次,不会随数据的改变而改变v-html:让HTML渲染成页面v-text:标签内容显示js变量对应的值v-prev-cloakv-show:显示/隐藏内容三、动态绑定属性v -bind 基本使用V -bind 魔法糖数据的绑定控制标签class类名控制标签style样式四、条件指令v-if:显示/隐藏内容v-elsev-else-if条件渲染案例五、计算属性基本使用小练习:两个数值相加,计算出结果原创 2021-04-28 18:10:25 · 995 阅读 · 2 评论 -
拓展:块级作用域var、let、const的使用
拓展:块级作用域var、let、const的使用let/var事实上var的设计可以看成JavaScript语言设计上的错误. 但是这种错误多半不能修复和移除, 以为需要向后兼容.大概十年前, Brendan Eich就决定修复这个问题, 于是他添加了一个新的关键字: let.我们可以将let看成更完美的var块级作用域JS中使用var来声明一个变量时, 变量的作用域主要是和函数的定义有关.针对于其他块定义来说是没有作用域的,比如if/for等,这在我们开发中往往会引起一些问题。原创 2021-04-28 00:20:53 · 354 阅读 · 0 评论 -
Vue 入门介绍
Vue(读音/vjuː/,类似于view) 是一套用于构建用户界面的JavaScript 渐进式框架。框架。它基于标准 HTML、 CSS和 Javascript JavaScript 构建, 并提供了⼀套声明式的、 并提供了一套声明式的、 组件化的编程模型, 组件化的编程模型, 帮助你⾼效地开发⽤户界⾯。帮助你高效地开发用户界面。无论是简单还 ⽆论是简单还 是复杂的界面,Vue 都可以胜任。不仅易于上手,还便于与第三方库或既有项目整合,可以在某个文件单独使用,只用一部分,也可以整个项目中都使用。原创 2021-04-26 09:49:51 · 365 阅读 · 0 评论 -
响应式布局
文章目录响应式布局一、响应式设计1.定义2.响应式设计的优势二、屏幕的相关概念三、viewport 视口1.什么是iewport2.设置viewport三、媒体查询 @media1.媒体类型2.媒体特性3.媒体查询用法用法一用法二用法三4.媒体查询语句运算符四、断点设置1.常用设置一2.常用设置二3.推荐设置三五、响应式图片响应式布局一、响应式设计1.定义伊桑·马科特(Ethan Marcotte)在2010年首先提出了响应式网页设计(RWD,Responsive Web Design)这个术语原创 2021-03-11 21:19:46 · 603 阅读 · 0 评论 -
CSS网页布局
文章目录CSS网页布局一、布局相关的标签二、网页布局方式1.什么是网页布局?2.网页布局/排版的三种方式三、标准流四、浮动流1.什么是浮动?2.浮动的作用3.浮动的三种设置4.什么是脱离文档流?5.那什么又是半脱离文档流?6.overflow溢出属性介绍7.浮动元素贴靠问题8.浮动元素字围现象9.浮动流排版练习10.浮动元素高度问题(又称父级塌陷)11.清除浮动清除浮动方式一:清除浮动方式二:clear属性介绍需要注意的问题清除发动的方式三隔离法代码示例清除浮动的方式四清除浮动的方式五:13.总结五、定位流原创 2021-03-09 17:27:24 · 522 阅读 · 0 评论 -
CSS基础样式属性设置
文章目录css基础样式与属性设置一、宽和高二、字体属性1. font-family:文字字体2.font-size:字体大小3.font-weight:文字粗细4.font-style:文字风格5.color:文字颜色6.文字属性简写:7.总结:8.案例:三、文字属性1.text-align:文字对齐:2.text-decoration:文本装饰3.text-indent:首行缩进4.text-height:行高5.文字对其+行高实现文本水平垂直居中(掌握):6.字符间距(了解)7.单词间距(了解)8.示例原创 2021-03-08 21:25:17 · 1561 阅读 · 0 评论 -
css选择器
css选择器一、引入什么是css选择器?每一条css样式定义由两部分组成,形式如下: [code] 选择器{样式} [/code] 在{}之前的部分就是“选择器”。 “选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元素。参考资料:百度百科html中文网css选择器的本质css选择器本质就是css与html两种语法建立关联的特定标识符:就是在css语法中,通过html中白哦前的某种名字,与html具体的标签建立关联,从而使写在对应css选择器后的css样式能控原创 2021-03-06 21:14:41 · 370 阅读 · 0 评论 -
CSS基础
CSS基础一、什么是CSS?CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素。样式指的是HTML标签的显示效果,比如换行、宽高、颜色等等层叠属于CSS的三大特性之一,我们将在后续内容中介绍表指的是我们可以将样式统一收集起来写在一个地方或者一个CSS文件里当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染)。CSS3就是css语言,数字3是该语言的版本号css语言开发的文件是以.css为后缀,通过在html文件中引入该css文件来控原创 2021-03-05 22:31:18 · 260 阅读 · 0 评论 -
HTML常用标签详解
HTML常用标签详解一、head内常用标签1.基本标签(非meta标签)<!--title: 定义网页标题--><title>Title</title><!--style: 定义内部样式表. 内部用来书写css代码--><style> h1 { color: greenyellow; }</style><!--script: 内部用来书写js代码--><script原创 2021-03-04 21:25:03 · 9629 阅读 · 1 评论 -
HTML发展史与介绍
用户使用浏览器打开网页看到结果的过程就是:浏览器将服务端的文本文件(即网页文件)内容下载到本地,然后打开显示的过程。而文本文件的文档结构只有空格和换行两种组织方式,如果仅凭它俩,文本文件在打开显示时,显示的效果将会非常非常非常的单一。在编辑文件时会选中各部分内容,然后为内容打上不同的标记,比如什么是标题,什么是段落,然后存放硬盘里,等下次打开时,word会识别之前的标记,然后按照预先编排好的结果显示出来。原创 2021-03-02 23:28:57 · 676 阅读 · 1 评论 -
web前端开发介绍
前端内容介绍一、什么是前端应用软件组成:前端+后端后端负责处理业务逻辑&提供数据,任何与用户直接打交道的操作界面都可以称之为前端,主要负责页面展示、与用户交互等等下面都是前端:公司官网(在PC通过浏览器来访问公司网站)移动端网页(在手机上来浏览公司信息、小游戏等)移动端APP(例如:淘宝、去哪儿旅游、携程等)微信小程序(微信最新推出的功能,随用随装,不占用手机空间)。前端开发是从网页制作演变而来的。早期的网页制作主要内容都是静态的,以文字图片为主,用户使用网站也以浏览为主。随着互联网原创 2021-03-02 21:29:28 · 13655 阅读 · 1 评论 -
互联网行业职位介绍
互联网行业职位介绍1、PM项目经理( Project Manager )从职业角度,是指企业建立以项目经理责任制为核心,对项目实行质量、安全、进度、成本管理的责任保证体系和全面提高项目管理水平设立的重要管理岗位。项目经理是为项目的成功策划和执行负总责的人。项目经理是项目团队的领导者,项目经理首要职责是在预算范围内按时优质地领导项目小组完成全部项目工作内容,并使客户满意。为此项目经理必须在一系列的项目计划、组织和控制活动中做好领导工作,从而实现项目目标。当然在互联网公司这个有着项目经理or产品原创 2021-03-02 18:58:00 · 1151 阅读 · 0 评论 -
web开发流程
web开发流程web开发流程图一、需求分析阶段在需求分析阶段,即上图所述 ”需求明确“之前的阶段产品经理PM召集需要项目相关人员,开需求讨论会、讲解原型相关人员需要以此了理解产品的需求,提出质疑:这是什么功能,怎么做,为啥这么做,大概包含如下几个方面:评估实现难度和实现成本,是否有潜在技术问题/风险对比一下自己整理的需求图,如果有和自己想的不符合的,提出疑问理解PM提出此次需求的目的,明白哪些内容是重点,哪些次要,可以适当取舍如果产品要求提供时间,简单项目可以预估,复杂项原创 2021-03-02 18:39:20 · 4073 阅读 · 1 评论 -
从小白到大神:我的前端笔记
前端基础学习笔记原创 2021-03-02 16:51:29 · 455 阅读 · 1 评论