自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(29)
  • 收藏
  • 关注

原创 JavaScript操作 DOM 的这些事件基础

回顾上一篇中我们初步了解了一下 WebApi 这些接口,知道了支撑 WebApi的两个核心点 DOM 和 BOM,上一篇主要聊的是获取元素的这些方法,这一篇中会着重说一下操作元素的这些方法。事件基础概述:简而言之,js让我们有能力创建动态页面,事件使可以被 js 侦测到的行为一般分为三步第一步:获取事件源第二步:注册事件(绑定事件)第三步:添加事件处理程序(采取函数赋值形式)// 点击一个按钮,弹出对话框// 1、事件有三部分组成 事件源 事件类型 事件处理程序 称之

2021-12-16 22:27:32 1207

原创 javascript中获取 DOM 元素的几种方式

回顾上一篇中我们初步了解了代码提交的规范,这个规范也是业内相当知名的规范,建议添加到你的项目中熟悉熟悉。有什么不懂得欢迎随时留言~在之前我们已经把 JavaScript 基础部分全部学完了,基础部分一共分为了10篇,在10篇的内容中需要记住的东西还是挺多,所以需要你多在编辑器中敲一敲。应用在实际的场景中,纸上得来终觉浅,绝知此事要躬行。WebApi从这篇及往后我们要进一步扩展知识面了,来到了 js 中进阶的部分—— WebApi,初来乍到你肯定会问这个 WebApi 是什么?API:顾名思义就是接口

2021-12-14 22:59:44 4062

原创 你不得不掌握的前端提交规范(git cz)

背景最近在提交代码的时候发现每次提交的代码说明都是层次不齐的,看上去让人感觉到特别的凌乱。第一:让人看上去感觉这个程序猿好像不是“正规”出身,再一让自己在回溯代码的时候没有任何头绪。简介所以就找到了一款适合大众而且也是相当知名的代码提交规范:commitizen(git cz),这款工具也是最早 Angular 团队提交代码的时候用的一套规范,在现今 github 和团队场景中运用十分广泛的工具。说明commitizen 也可以简写为:git cz 格式化工具,为我们提供规范了代码的提交信息,在团

2021-12-10 23:11:16 5982

原创 盘点JavaScript运行机制:简单类型和复杂类型

回顾上一篇中我们聊了聊 js 的字符串对象,手写了常用的字符串操作方法,有些方法和数组对象是非常类似的,很容易记起来。除此之外还知道了一个重要的概念,字符串所有的方法都是不可变的(不会修改值本身),操作完成之后会返回一个新值。这一篇中纯粹是一个概念性的文章,对 js 中的简单类型和复杂类型做一个简要的概述简单类型和复杂类型在 js 中简单类型又叫做基本数据类型或值类型,复杂数据类型又叫做引用类型值类型:简单数据类型/基本数据类型,在存储变量中存储的是值本身,因此叫做值类型。// 基本数据类型

2021-12-09 22:51:41 761

原创 盘点JavaScript哪些常用的字符串对象

回顾上一篇中我们聊了聊 js 中的数组对象,在数组对象中我们看到了关于 js 内置方法对数组进行处理,常用的push、pop等,除此之外还有对数组进行排序或者反转等方法,在往后的工作中是非常常用,所以需要熟练掌握。这一篇来看看常用的字符串对象字符串对象基本包装类型在 js 中提供了三个基本包装类型:String、Number、Boolean。一般在创建、赋值、销毁会经历三种顺序。把简单数据类型包装为复杂数据类型var temp = new String('andy')把临时变量的值给

2021-12-08 23:31:48 137

原创 盘点JavaScript哪些常用的数组对象

回顾上一篇中我们盘点了 js 哪些最常用的内置对象,对Math、random以及Date对象进行了详细的讲解,这三个对象在往后的工作中也是发挥着举足轻重的位置,都是非常常用的对象,可以自己在编辑器中多加练习这篇中我们对 js 中的数组对象进行说明,同样数组对象中也包含了非常多的元素方法,对数组的处理也扮演很重要的角色。数组对象(Array)在前端中数组和字符串是处理信息最常用的两种方式,所以对于数组和字符串的内置方法也需要烂熟于心。创建数组的两种方式利用数组字面量利用 new Arra

2021-12-07 21:35:09 209

原创 JavaScript中的这些内置对象

回顾上一篇中我们说了 js 中的作用域和预解析,感受了 js 发展的过程中一些特有的声明和语言文化,js 在运行的时候也是按照预解析的顺序来运行的,所以会出现某些语句声明不恰当报错的行为。每门语言的诞生和发展同样也绕不开它当下所诞生的背景和时代发展的历程,需要慢慢理解它和适应它这一篇中我们要说一说 js 中的内置对象,语言也是非常智能的,它同样会将常用的方法封装在自己本身可供使用者直接去调用,所以就产生了内置的一些对象,这些对象不妨有数组的对象、字符串对象。我们这一讲就先来聊一聊 js 内置对象常用的

2021-12-06 21:24:23 429

原创 JavaScript基础语法之对象的哪些事

回顾上一篇中我们主要说了 js 中的作用域,代码的名字在某个范围内才起作用,并非在全部的场景或者块下都能有作用。除此之外还了解了js执行中比较中的机制:预解析。js执行的引擎会将 var 和 function全部提到最面前,然后按次序依次执行之后的代码等内容这次我们来了解 js 中比较重要的另一个知识点:对象,如果你学过其他的语言肯定也知道对象这个名词。在大部分语法中都有对象这个属性,而且也扮演这很重要的角色对象首先需要了解的是对象是一个具体的事物,是看得见摸得着的(例如:书不是对象,红宝书就是一个

2021-12-05 19:11:55 357

原创 JavaScript中的作用域和预解析

回顾上一篇中我们主要说了 js 的函数,牵扯到函数的概念与使用,以及函数的传参和调用等方面的内容,函数是js中最具代表意义的功能,也是未来十分常用技术点。文章内容都是非常之基础,如果想了解深入建议多看看红宝书等书籍。这篇中我们要说一下 js 中的作用域和预解析,对于正常思维考量,你一定会觉得这部分内容会有不解,特别是针对预解析的内容,但是没关系,你可以尝试的多了解了解 js 的发展历程等原因会发现语言的发展绕不开它本身当下的环境和所处时代等多种因素。作用域作用域:是代码名字(变量)在某个范围内起到的

2021-12-04 19:36:09 831

原创 JavsScript基础篇之函数定义的几种不同方式

回顾在上一篇中我们聊了聊数组的创建和获取数组中元素的方法,同时上一篇中我们主要利用数组来处理一些基本的运算,提升一下逻辑能力,对于刚入门的来说这些还是挺难的。不过没关系,你可以看看多缕一缕它们之间的关系,不需要死记硬背,以理解为主。慢慢熟悉就可以,主要还需要自己手动的多敲几遍。这一篇中我们主要将函数的概念和函数声明的几种方式,牵扯到的还有函数中的形参和实参传参的问题,除此之外我们还会说一说 最常用 return 的作用,以及函数中处理参数的 arguments等。函数函数的概念函数:封装了一段可以

2021-11-22 22:19:49 337

原创 javaScript基础篇之数组是怎样锻炼你的逻辑能力

回顾上一篇中我们学习了 js 的第三篇循环应该怎么用,在循环中学习了最常用的 for 循环,也顺带熟悉了 while 循环和 do…while 循环,以及 break 和 continue 的区别。在循环中再搭配上运算符和表达式成为了日常工作中的大部分场景应用。往后的工作中基本上都是围绕循环和表达式这一部分基础内容展开。这一篇中我们会围绕数组展开讨论,但是主体内容并不是数组,而是处理数组的一些逻辑能力。这些也是未来迈向工作中一些必不可少的能力。会运用到之前说到的循环、判断、表达式等内容,可以在之前先自己

2021-11-17 21:54:52 934

原创 javaScript基础篇说一说循环应该怎么用

回顾上一篇中我们学习了 js 的第二篇运算符和表达式,在运算符和表达中我们简单的讲述了算术运算符、比较运算符和逻辑运算符等这些的内容,这些都是工作中比较常用的内容,也是逻辑中满足了最基本和最常用的这些运算。除此之外,我们讲述了流程控制中的内容。流程控制也就是if-else 这些控制,这些内容和运算符共同构成了最基本也是最常用的 js 语法。未来基本上程序都是围绕这些内容来展开的。这次我们就来看看程序中也相当重要的一点:循环,在循环中你会发现一切重复的东西都需要简化,这也就是循环所做的事情。在往后的工作当

2021-11-13 20:28:58 582

原创 JavaScript基础篇运算符与表达式

JavaScript基础第二篇 —— 运算符/流程控制回顾上一篇我们学习了 js 的第一篇基础——变量,在看变量之前,简单的了解了计算机的组成部分和浏览器 的组成部分,在js中了解了最基本的声明变量和使用变量,以及转换字符串和转换数字类型等,还有小细节的 例如 typeof 检测变量等需要重点掌握的,基础需要不停的温习。这次就来看看 js 中的运算符和流程控制的内容,慢慢的从基础就要开始深入到逻辑上的东西了。这些都是构成了未来工作当中不可或缺的一部分,也是刚毕业进入到公司最先了解公司业务的这一部分,打

2021-11-04 22:56:51 405

原创 初识JavaScript第一篇及解释器和编译器

JavaScript基础第一篇 —— 变量回顾整个上一章节我们学习了布局的三篇,在布局中学习了流式布局和flex布局以及最后的rem布局,这些都是和布局相关的,因为移动端的流行,所以免不了需要前端中去兼容各种终端。故此方式还是挺多,各显神通。可以根据显示的业务场景或者自己团队比较擅长的布局方式去写。布局学完之后,今天我们就进入了前端中相当重要的一个知识点,也就是:JavaScript,通常称之为:js。也是前端中非常重要非常好玩的一环,在往后的工作中写业务逻辑都和js是密不可分的!所以基础一定要扎实。

2021-11-01 23:38:22 892

原创 前端中常用的媒体查询详解,sass基础用法概览

常用布局第三篇 —— rem布局回顾在上一篇中我们结束了 flex 布局,flex 布局说的内容还是比较多的,而且对于flex布局来说,未来的工作中大部分的应用场景都在flex布局中,所以掌握 flex 布局在未来写页面时会非常的顺利,因为牵扯 flex 的内容比较多,所以在空闲的时候可以多看看 flex 相关的东西。除此之外,这篇说的 rem 布局,也就是常说的媒体查询,常用于区分 pc 和 mobile 端内容。同时也是布局中的最后一篇内容了,下一篇开始我们就要开启前端中的另一个最最重要的 jav

2021-10-26 23:16:04 1903

原创 前端flex布局最全文档,工作学习中复习必备

常用布局第二篇 —— flex布局回顾在上一篇中我们结束了流式布局,流式布局中主要是说了理论的知识比较多,最主要的还是移动端中的二倍图效果是非常重要。还有对于视口的效果,末尾之后我们又说了背景缩放的问题background-size,和特殊的样式例如兼容-webkit-等效果。基础还是需要好好学习。flex布局原理flex 是 flexble Box 的缩写,意为“弹性布局”,用来为盒模型提供最大的灵活性,任何一个容器都可以指定为flex布局,值得一提的是在现在大部分的工作中用flex布局的占比是非

2021-10-18 23:17:32 754

原创 为什么常用二倍图,流式布局中一倍图是否靠得住

常用布局第一篇——流式布局回顾上一篇中我们结束了 css3 中的内容,回顾css3 我们深入的学习了css中的东西,在css的基础上c3又有了非常好的创新,这些都在日常的工作中特别的常用,所以需要好好温故而知新。h5c3的基础学完之后,就开始布局了,今天是布局的第一篇。先来看看流式布局。视口视口(viewport) 就是浏览器显示页面内容的屏幕区域,视口可以分为布局视口、视觉视口和理想视口布局视口一般移动设备的浏览器默认设置了一个布局视口,用于解决早期pc端页面在手机上显示的问题IOS、

2021-10-14 22:45:22 1725 2

原创 css3中的3D转换效果有哪些,浏览器私有前缀兼容写法

html5/css3 基础篇(第三篇)回顾这次基本上是 html5/css3 最后的一部分内容了,一共h5c3分为了三讲,今天是最后一讲内容。回顾上一篇我们基本上学习了 css3 中一大部分的内容,我们学习了基于transform的移动、旋转、缩放等常用的效果,还掌握了css3 2D转换的综合写法,不仅如此还学习了 animation动画效果,这些都是为css3实现更为酷炫的效果而学习的内容,而且也为css添加了很多可扩展的技能。看知识总是比较散漫的,如果想烂熟于心还是需要多加练习。3D转换概述3D

2021-10-11 23:24:02 430

原创 一文说清楚css3具有颠覆意义的2D转换效果

html5/css3 基础篇(第二篇)回顾今天我们来说一说h5/c3的第二篇,回顾上一篇我们开始了h5/c3的第一篇,我们重新学了一下VsCode的基础应用以及里面的插件,插件也分为基础和进阶,不同学习阶段运用不同的插件会如虎添翼。在之后我们学习了html5中新增的语义化标签、还有新增的多媒体标签等。还有表单和css属性选择器和伪类这些,不止一遍的强调基础是重中之重,基础阶段的学习本身就是重复学习的过程,基础一定要打牢。css3 2D转换转换(transform)是 css3 中具有颠覆意义性的特征

2021-10-08 14:21:02 215

原创 详解html5新增的标签与css3中伪类和伪元素

html5 / css3 基础篇(第一篇)回顾是的,你没看错!今天是一个全新的开始,今天这一讲我们就要开始h5和c3了,html 和 css的基础篇我们都告一段落了。html一共两篇,css走过了7篇,如果基础不太熟悉的话,建议多看看 css 和 html 基础篇。从今天开始我们就要开始新的征程了,进入到 h5 和 c3 的环节了。现在工作中基本上对于html/html5、css/css3 都是一个硬性的要求。所以接下来h5和c3的学习当中会在原本的基础上更上一层楼。期待全新的认知吧!真正的敲代码神器

2021-09-28 23:28:30 578

原创 精灵图在现代前端中到底有用没,css中显示和隐藏竟有两种不同方式

css基础篇(第七篇)回顾在上一讲中我们基本上学习了css中定位的几种方式,包括定位在实际工作中常用的口诀等,除此之外还学习了margin:0 auto 水平居中的效果、未来常用的z-index等层叠。我们还详细的阐述了样式的书写顺序到底能不能影响渲染性能,如果没有看到的小伙伴可以看前一篇文章。这一讲我们将开启css基础篇的最后一讲。之后就要开始学习 css3 和 html5 了!元素的显示与隐藏dispalydisplay:none —— 隐藏对象,隐藏之后位置也不能占有display:bl

2021-09-23 23:44:04 677

原创 样式的书写顺序到底能影响渲染性能吗,css中定位到底有几种方式

css基础篇(第六篇)回顾在上一讲中我们基本上掌握了 css 的书写顺序和一些简单的布局样式和流程,因为上一讲中并没有涉及到太多的技术类型,基本上都以理论为主的,所以看起来比较轻松一点。“思想先行”一直是我觉得比较重要的一点,在写布局的时候也是这个道理,一定要先思考才能写出比较合理的布局方式,如果布局不稳的话 后续样式就更无从谈起,特别对新手来说是尤为重要的。关于评论上一篇内容,小伙伴:“wuhu” 留言说:“我记得样式的属性顺序最好按照重流>重绘,可以提高渲染性能”,在这里针对这个问题再次说

2021-09-17 00:15:46 368

原创 css正确的书写顺序,这些工作之初基本习惯你都掌握了吗

css基础篇(第五篇)回顾在上一讲中我们基本上了解了 css 中比较重要的清除浮动四种方式以及float怎么用会比较合理,以及在 css 中常见的普通流、浮动、定位等问题。除此之外在前端中掌握基本的 ps 技巧也是非常重要的。所以作为基础一定要熟练运用,熟练掌握。在这一篇中我们就不说 css 的内容了,作为 css 的中间篇幅,我们就综合的说一说对于新手来说前端中布局的重要性以及对于初入职场中对于 css 来说应该遵守哪些规则,避免在工作期间踩坑等。css中的书写顺序先来说一说为什么要出现书写顺序

2021-09-14 22:24:27 389

原创 详解css中清除浮动的四种方式,float怎么用最合理

css基础篇(第四篇)回顾在上一讲中我们基本上学习了 css 中经典的塌陷问题以及 margin 和 padding 具体指的是什么和怎么合理运用,除此之外,在上一讲的最后我们还了解了圆角边框和盒子阴影,更能熟悉的学习对于盒子更多非常规的时候怎么去贴合业务。掌握基础是非常重要的,所以需要不停的学习和练习。css布局的三种机制在之前我们认识的都是css中按照正常流去布局的,正常流就是按照正常的逻辑从上到下,从左到右去布局,这次以及往后我们学习了浮动和定位之后你会发现,其实在日常的业务和工作当中按照正常

2021-09-11 18:42:06 259

原创 css中塌陷问题怎么解决,margin和padding应该怎么区分

css基础篇(第三篇)回顾在上一篇中我们基本了解了css中background的综合写法以及css中的权重优先级问题,在这一讲中我们会认识一个比较重要的padding和margin,并且会了解到css中的塌陷问题,这在往后工作和学习中都是必不可少的部分甚至相当重要。如果不了解或者不太熟悉css基础的话,建议去看一看之前的篇幅,这一篇接着css开始讲。看透网页的本质在现代的html布局中,我们基本上都是使用盒子模型来布局,简而言之就是利用div来布局,所以说往后对于整个盒子的控制是一个重点。最重要的是

2021-09-08 23:25:07 2477

原创 css中background书写顺序,css中权重怎么计算

css基础篇(第二篇)回顾上一篇css中基本山的认识了css是用来干什么的,以及大概的类型和基本的样式和数写规范之类的东西、重要的还是对于基础前端人员一个必备的技能:Chrome调试工具,这个是非常重要的,如果不了解或者不太熟悉css基础的话,建议去看一看css第一篇的东西,这一篇接着css开始讲。常见的css选择器在css中,除了类选择器和id选择器之外,常见的还有后代选择器和子元素选择器、交集选择并集选择器等。后代选择器后代选择器一般是指在div中包裹了a标签这类的选择器。// 后代选择器

2021-09-04 22:45:05 375

原创 前端开发css必备技能都有哪些,Chrome调试工具你真的理解吗

css基础篇(第一篇)开篇词在前几篇文章中我们综合的讲解了 html 的基础用法,用两篇文章来综合的阐述了 html 基本用法以及浏览器的相关内容,如果 html 不太熟悉的话,建议好好看看之前的两章内容,在此之后我们要开启新的知识点了,那就是 css ,css对于整个前端来讲还是相当重要的,所以需要好好的学习和回顾。css 部分 一共分为 7 讲,都是阐述了 css 的基本用法,相对于 html 来说 css 的知识点还是挺多。在 css 熟悉之后,我会单独的加一篇文章来说明下 scss,这个对以后的

2021-09-01 23:20:12 147

原创 html创建表格有那些小技巧,表单中真的有这么多功能吗

html基础篇2上一篇html我们聊了初识html的基本常识和所用的浏览器内核以及基础的标签等等,这次我们再聊一聊html的表格和表单等语法。这是html基础偏的最后一讲,下次就到了前端重要的样式部分了!注意:本系列文章适合新手小白入门学习。文章如有疏漏请指正。html中的表格...

2021-08-29 23:25:51 225

原创 初识html,一文搞懂HTMl骨架标签都有哪些含义及浏览器内核

html基础篇初识html(大概两篇),下面会从浏览器以及web标准和相关标签来说明整个html结构和由来。注:本系列文章适合新手小白入门学习。文章如有疏漏请指正。浏览器的内核在前端的学习中一般使用的都是Chrome浏览器。不过在整个浏览器中还有非常多的其他浏览器内核:通常指的是浏览器的核心技术(负责读取网页相关内容)IE 的内核:Trident————ie、猎豹、360浏览器、百度浏览器等firefox 的内核:Gecko————firefoxsafari 的内核:webkit—

2021-08-26 00:01:20 581

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除