- 博客(46)
- 收藏
- 关注
RSS订阅原创 JS中数据的分类及深浅copy
**前言：**关于JS中数据的分类有很多种，比如按照数据类型分为数值、字符、数组、布尔型、对象等等，今天要对JS中的数据进行存储方式分类；
2020-07-05 17:19:54
184
原创 JS的编译和执行
一、JS的编译和执行js是一门解释性语言程序执行时会预先编译，再执行找到所有的var和function，做出对应提升编译时提升执行时按照逻辑，结构正常执行；变量和函数的提升var的提升提前声明，=号的位置赋值console.log(a); // undefinedvar a = 10;console.log(a); // 1...
2020-04-28 21:18:30
2723
原创 函数的作用域
函数的作用域函数的作用域简单来说就是变量起作用的区域；它包括全局作用域和局部作用域；全局作用域：// 全局作用域：不属于任何一个函数 var a = 10; // 能够作用的区域，整个代码 console.log(a) function fn(){ var b = 2; console.log(a*b); } f...
2020-04-28 20:59:25
452
原创 函数的返回值
函数的返回值，即函数自身的处理数据或执行结果为什么要有返回值？方便函数执行结果的二次使用，或在其他程序调用时，需要将结果返回出来；关键字：returnreturn可以指定函数的返回值；return执行后，当前函数结束；一个函数可以有多个return但是只能执行一次return 且一次只能返回一个数据；可以返回所有数据，包括返回一个函数，当返回值是一个函数时，就形成了闭包的概念函数...
2020-04-28 20:25:38
3664
原创 JS中函数的参数
函数的参数函数的参数包括形参和实参两种，函数创建时，function fn(a){} 这里的a是形参（个人理解为形式上的参数，用来接收以后调用函数时传进来的实参）例如: ``function fn(a){console.log(a);} 这里的a为形参，形参其实是函数内部自己声明的应该变量，当我们调用函数时，实参就会赋值到形参，从而处理结果；执行带有实参的函数时：函数可以分为功能性函数...
2020-04-28 18:35:24
313
原创 JS中三大特殊数据
1、NaNNaN表示不是一个数字（not a number）NaN是非法运算的结果，且每一个NaN的来源都不一样，它不等于任何值，即console.log(NaN == NaN)的结果为false;如何检验NaN？js中给我们提供了一个检测方法：isNaN()，十分语义化的应该方法，只有console.log(isNaN(NaN))得到的是true(或者里面为非法运算)，代表它是个NaN，...
2020-04-27 22:27:09
164
原创 关于JS中的==和===
关于不严格比较==和严格比较（全等于）===我们一般只是对==和===有个基本的概念，而对于实际的运用场景，会有一些似懂非懂的时候，我们都知道==是不严格比较，也就是只比较数值，而当两边数据类型不同时，就会进行隐式类型转换，再比较，而===是严格等于/全等于，也就是数值和数据类型都要相等，才成立，那么就会有人在使用的时候偷懒，依赖==是隐式转换，从而无论遇到什么情况都使用==，那么这样做对吗？或...
2020-04-25 00:24:42
239
原创 JS的循环语句以及循环中的关键字
循环语句循环语句1、while 循环；语法：while(){}while 语句名() 执行条件（停止条件）{} 重复执行的内容（循环体）这里我们实现在控制台打印1-10：var i = 1;while(i<=10){ console.log(i); i++;}循环语句2、do while 循环；语法：do{...
2020-04-24 23:49:05
873
原创 js的分支语句
在介绍分支语句之前，首先介绍js中打印的三种方法；按照惯例我们学一门编程语言，第一句就是外面的“hello world”，那么js中如何实现打印呢？js的打印方法// 变量声明 var a = 123456; // 也可以只声明不定义 var b; // 打印信息的方式 alert(a) // ta弹出窗口方式 ...
2020-04-24 23:06:45
206
原创 JS中的数据类型转换&运算符
一、数据类型的转换为什么要转换？如果，用户或者计算机给了一个数据并不是我们当前程序所需的数据类型，那就需要转换；数据类型的转换方法（2种）强制转换（主动转换）常用到的就是字符和数值之间的相互转换字符转数值- parseInt(要转换的数据或变量)- 从左向右依次检测，遇到第一个非数字的字符，停止转换- 忽略小数点后所有的内容，其实是将小数点识别成了非数字- 如果第一...
2020-04-21 23:05:59
138
原创 JS简介
JS的历史我们照旧介绍一下历史，说了你可能不信，最初的JS是Brendan Eich–布兰登·艾奇为了应付公司安排的任务，用10天时间就把Javascript（以下简称JS）设计出来了,JS的原本打算命名为LiveScript，但是因为是跟Sun公司（将Java成功推向市场的公司），就有了JavaScript这个名字。这种客户端脚本语言（虽然现在不再局限内于在客户端使用，服务器端也可以用Jav...
2020-04-20 23:26:43
203
原创 HTML页面编写中常遇到的bug
先啰嗦几句：说到bug，对程序员来说可谓是又恨又爱，有人说程序员大部分时间花在了命名和改Bug上也不是不无道理的，“一杯茶一根烟，一个bug改一天2333”，有Bug其实再正常不过，其实bug也是好事儿，因为我们从改bug的过程中更深层次的理解我们的代码，也会从中吸取到经验。今天就对html中常见的bug进行一个总结:首先是IE低版本浏览器比较经典的bug：1:图片边框问题：bug : 当...
2020-04-20 22:39:54
503
1
原创 移动端开发中vw和rem组合适配
什么是rem?我们做的单位em表示元素的字体大小跟随父元素大小相关联，比如父元素字体大小为10px，那么1em就是10px，2em则是20px; 而rem其实就是元素依据根元素的字体大小进行设置,这样的话如果我们网页中的元素使用rem作为大小的单位，就能实现等比缩放，也叫rem布局；说道移动端开发，就少不了对dpr的了解:dpr：设备像素比，它等于物理像素（真正意义上的像素大小，比如移动设备...
2020-04-17 00:18:36
619
原创 怪异盒模型&弹性盒
怪异盒模型怪异盒模型又叫IE盒模型，它可以使padding和border都在元素宽高的内部，不会把盒子撑大一般在移动端开发时使用。触发条件：box-sizing:border-box;例：我们设置了一个宽400px高300px的盒子，给它添加了10px的border和50px的padding，标准盒模型中，padding会把盒子撑大且border会在盒子的外部，而添加**box-sizi...
2020-04-14 22:36:40
393
原创 Iconfont图标
今天给大家简单介绍一下Iconfont-阿里巴巴矢量图标库；阿里巴巴矢量图标库提供了很多我们前端开发人员需要的图标，你想到的想不到的应有尽有，而且使用起来很是方便，可以把它理解为具有文本特征的图标；下面介绍一下使用方法：步骤一：进入iconfont官网注册登录（此处略）步骤二：进入图标库，进行图标的搜索或者选择步骤三：下载选中的图标，然后解压到项目文件夹里第四步：引入icon...
2020-04-14 22:06:09
842
原创 宽度自适应属性值fill-available、fit-content、max-content、min-content
CSS3中，对width新增了一些属性值，用来进行自适应。(IE不支持)1、width:fill-available;合理分配剩余有效空间：效果：fill-available可以让元素宽度进行自动填充，改元素不仅限于块状元素，行内元素亦是如此；此外，fill-available不同于width=100%,它会影响padding的解析，也就是加了padding后元素整体的宽高不会变化,不...
2020-04-14 13:33:35
1215
原创 CSS3伪类选择器&层次选择器
CSS3伪类选择器A、动态伪类选择器动态伪类，因为这些伪类并不存在于HTML中,而只有当用户和网站交互的时候才能体现出来，动态伪类包含两种，第一种是我们在链接中常看到的锚点伪类，如":link",":visited";另外一种被称作用户行为伪类最常见的锚点伪类：.demo a:link {color:gray;} 链接没有被访问时.demo a:visited{color:yell...
2020-04-11 22:16:30
252
原创 CSS3选择器
一、CSS3属性选择器；以下，E—>标签，attr—>属性 value—>属性值；1、E[attr]只使用属性名进行具体标签的选择；理论上只要是标签带有的属性，都可以使用；例：四张，宽度均为150px的图片：使用属性选择器进行样式修改：那么这四张带有alt属性的图片全部被选择：2、E[attr=“value”]属性且指定属性名，使用较多；语法：...
2020-04-11 16:41:50
86
原创 H5新增表单元素和表单验证
新增的type类型：1、emaile用来验证输入的字符串是否是email地址的格式，若不是，则不允许提交;注：即检测输入内容是否含有@符号且@符号前后都必须有内容，但是它并不验证email是否存在。可以为空，除非用required属性（验证输入不能为空）；此外它还允许文本框内输入一串以逗号分隔的email地址。2、url用来验证输入的内容是否是URL地址，不是则不允许提交；注：即u...
2020-04-10 23:28:18
500
原创 H5新标签简介
H5新标签在html第5次重大更新后，也就是H5中，为了使html在实际开发中更加灵活、简洁，H5新增了一些标签和一些新的规定。新增的语义化标签section 更偏于划分区域。（网页的外围结构…更类似与div）article 更偏向于内容的展示aside 侧边栏（在一旁的）header 网页头部或者是内容块头部footer 网页的顶部或者内容快的底部na...
2020-04-09 21:56:23
1051
原创 CSS3的动画属性
动画属性：animation；在元素的移动中，我们除了常用的利用hover配合过渡trasition，定位和位移外，我们还会用到动画属性animation;CSS3，我们能够创建动画，这可以在许多网页中取代动画图片、Flash 动画以及 JavaScript。首先，动画的实现的通过对关键帧的调用来实现的。不同于过渡动画只能定义首尾两个状态，关键帧动画可以定义多个状态，或者用关键帧的话来说，...
2020-04-08 22:20:10
114
原创 CSS_3D
3D空间属性---->transform-style:preserve-3d;CSS代码演示：我们把box转换成3D空间，然后先对box进行Y轴方向的20度旋转，方便我们看到后面Y轴旋转的h1的效果：（视频还在审核，我先发出来，明天再补视频链接···）对于box2，我们对子元素h2进行Z轴方向的位移，也就是说h2在box2上方300px处，然后我们对box2进行Y轴的50度旋转，...
2020-04-07 21:46:19
125
原创 CSS的2D属性transform
属性transform（变形）它的属性值是很多的功能函数，下面一一介绍：1、位移函数---->transform:translate（x,y），x、y对应left、top；位移的作用类似于相对定位relative，可以将元素默认基于原先位置进行移动；(本文所有的例子，都添加有1s的过渡效果，即transition：1s;)例：（鼠标划过box1时，h1向右移动200px,垂直方向不...
2020-04-07 21:36:10
189
原创 CSS的过渡
过渡属性：transition过渡类似于background，可以简写，与过渡有关常用的属性有：1. transition-property：检索或设置对象中的参与过渡的属性2. transition-duration：检索或设置对象过渡的持续时间3. transition-delay：检索或设置对象延迟过渡的时间4. transition-timing-function：检索或设置对象...
2020-04-04 20:22:45
279
原创 CSS的渐变属性
1、何谓渐变？让背景色在多个颜色中平稳过渡。所谓平稳，类似于左图这样谁要跟你说右图是渐变，你可以拿出你鼠标垫下39米长的大刀让他先跑40米… …2、渐变介绍线性渐变----->linear-gradient()语法：background: linear-gradient(direction, color-stop1, color-stop2, …);它其实是个功能函数，包含...
2020-04-04 17:57:50
777
原创 浏览器前缀简介
浏览器前缀来源？很多css3属性 最初的预览版没有形成最终的正式版，但是为了支持这些新属性，很多主流浏览器提供了属于自己的语法规则 ，即“浏览器前缀”各主流浏览器的前缀：-webkit- 谷歌、苹果 浏览器前缀-moz- 火狐浏览器前缀-ms- IE浏览器前缀-o- 欧鹏浏览器注： 添加浏览器前缀 -> 兼容...
2020-04-04 16:58:48
782
原创 简述BFC
BFCBFC(Block formatting context)直译为“块级格式化上下文”。它是一个独立的渲染区域，只有Block-level box（块）参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。BFC的布局规则一、内部的Box会在垂直方向，一个接一个地放置。二、Box垂直方向的距离由margin决定。属于同一个BFC的两个相邻Box的m...
2020-04-03 00:09:31
154
原创 关于表格&表单
表格补充1 ： 数据行分组<thead></thead><tbody></tbody><tfoot></tfoot>2 ： 数据列分组<colgroup span="value"></colgroup><!--span属性为把几列分为一组-->3 ： 列标题<th...
2020-04-01 21:51:30
115
原创 简述PC端的宽高自适应问题
PC端的宽高自适应宽度自适应（了解）：元素的宽默认是跟随父元素的， 尽量不要规定死；不写默认是100%的父元素的宽度；后续：宽度100%，根据窗口的宽度不同，作出不同结构变换的响应式网页；高度自适应；高度自适应第一种情况：内容撑开父元素主要针对内容块；（考虑一些版块后期会不会经常性修改）需求一：当元素的height不去设置或者是设置成auto是（默认），那么height是被内容撑开的...
2020-03-31 23:08:58
940
原创 定位补充
position :fixed: 固定 --------------->经常原来做广告233333333333参照物为浏览器窗口；脱离布局流；将元素固定在浏览器正中间： 方法1、fixed left:50%; top:50%; 然后再用margin-left：-1/2width; margin-right:-1...
2020-03-30 21:43:57
120
原创 CSS中元素的定位
定位属性：position —>检索或设置对象的定位方式A、position：static 静态定位—> 默认值，static元素会忽略任何的right、top、left、bottom声明；B、position：absolute 绝对定位—> right:0; bottom:0; 定位在参...
2020-03-28 23:47:43
102
原创 HTML中单行文本溢出时的省略号处理
单行文本溢出时的省略号处理常见的出现在新闻列表中：一般只有单行文本溢出才做省略处理CSS语句：1、white-space: 以下属性值： pre:将文本按照预文本的格式输出 pre-wrap: 预文本且根据宽度自动换行 pre-line:和默认的也要 nowrap: 不让文本换行（常用） inherit：继承父元素的值2、**溢出overflow属性值...
2020-03-27 21:17:06
175
原创 元素类型及其转换
元素类型：HTML对标签分类----->单、双标签；CSS中对标签的分类：1、块状元素： 默认情况下在页面中以矩形区域显示； 自上而下排列，独占一行 可以直接添加宽高 一般情况下，作为其他元素的容器；2、内联元素（行内元素）： 在页...
2020-03-26 21:18:14
245
原创 CSS盒模型
CSS盒模型paddingpadding是在内容和盒子直接的，在盒子内部；padding是为了调整子元素在父元素内部的位置关系；padding 会改变盒子大小，如果想让盒子大小不变，需要让宽高减去对应padding的值；padding不能为负值；padding不会对背景图造成影响；注：如果一个盒子没有设置固定的宽高，那么padding值就不用减；margin margine是...
2020-03-25 20:21:58
79
原创 关于PC端页面布局
顺序：先做上下排版再做左右排版由外往里规划：元素命名： id选择器划分外围结构 -->id选用驼峰命名法||语义化 nav news case 等 版心的命名 -->连字符命名法 例：news-wrrap 内部内容块的命名 --> 下划线 例： news_left外部CSS样式表：...
2020-03-24 23:52:57
755
原创 CSS的列表、边框、背景图属性
CSS的列表列表样式类型 list-style-type:圆形circle/方形squre以图片代替标签 list-style-images:重点：list-style:none;我们一般都要清除默认属性；CSS的边框 borderborder-width:边框宽度boder-style:none/实线solid/虚线dashed/点状线dottedborder-color:边...
2020-03-23 22:59:39
231
原创 CSS的文本属性
CSS文本属性1、font-size: 控制文本大小 a、规定，默认是16px，为标准字体大小； b、文本字体大小设置为偶数； c、PC端项目，设置大小尽量不低于12px； d、从PS获取文本大小，汉字量取文本高度；另：文本单位除像素px外，还有pt (一般不用) 9pt = 12px 12pt =16px默认情况下，1em=16px 但是不同情况...
2020-03-20 23:18:38
1978
原创 CSS的选择器及其权重问题
CSS的选择器： 选择器：就是给标签取名字选择器的类型：1、标签（类型）选择器：（权重为1） 标签选择器可以对所有的同类标签起作用，对应标签div/p/i/strong 语法： 标签 {属性:属性值;}应用场景：需要统一或者清除标签内容的样式时；2、id选择器：（权重为100） 语法： 在标签内给用id给标签起名字：<标签 id=“名称”><...
2020-03-19 19:41:39
383
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人