- 博客(35)
- 收藏
- 关注
RSS订阅原创 闭包的学习
闭包（closure）是 JavasSript 的一大难点，也是它的特色。很多高级应用都要依靠闭包来实现。1、变量作用域要理解闭包，首先要理解 JavasSript 的特殊的变量作用域。变量的作用域无非就两种：全局变量和局部变量。JavasSript 语言的特别之处就在于：函数内部可以直接读取全局变量，但是在函数外部无法读取函数内部的局部变量。注意点：在函数内部声明变量的时候，一定要使用 var 命令。如果不用的话，你实际上声明的是一个全局变量！2、如何从外部读取函数内部的局部变量？
2022-05-03 06:43:43
195
1
原创 Math 对象
Math 对象 用于执行数学任务不是一个构造函数，所以不需要new来调用，而是直接使用里面的属性和方法即可常用方法ceil( ) 对小数进行向上舍入（向大的数跑）floor( ) 对小数进行向下舍入 （向小的数跑）round( ) 把数四舍五入为最接近的数，在负数的情况下，当小数位是5的时候，不会五入，会舍去random( ) 返回0.0~1.0之间的随机数（包括0，不包括1）例如：0.7526642586288201 应用的场景 抽奖pow( ) 计算次方值。 例如Math.p
2022-04-28 15:43:16
182
原创 string的常用方法补充
toUpperCase（） 把字符串转换为大写substr（） 从起始索引号提取字符串中指定数目的字符substring（） 提取字符串中两个指定的索引号之间的字符slice（） 提取字符串的某个部分，并以新的字符串返回被提取的部分...
2022-04-27 16:08:24
272
原创 String对象
String对象var str = new String（参数）1、定义字符串的第一种方式：使用构造函数2、定义字符串的第二种方式：字面量的方式String常用方法和属性length 字符串的长度charAt（） 返回在指定位置的字符（注：字符串中第一个字符的下标是0）concat（） 连接字符串 replace（） 用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串...
2022-04-26 16:20:57
138
原创 Date对象和String对象
Date对象用于处理日期和时间首字母大写的内置函数是构造函数new Date() 可以理解为 构造函数Date使用new实例化一个时期对象oDatelet oDate = new Date();document.write(oDate);日期的格式有多种 ★必须是字符串的类型常用方法：getDate（） 返回Date对象的一个月中的每一天 ，其值介于1~31之间getDay（） 返回Date对象的星期中的每一天，其值介于0~6之间 （注：0-周日）getHou
2022-04-25 16:02:00
295
原创 JS数组的基本操作
concat 合并两个数组并生成一个新数组，不会改变原数组pop 删除数组的最后一项，pop会返回被删除的一项 原数组的最后一项会被删除unshift在数组的最前面添加一项原数组的前面会添加一项unshift 会返回新数组的长度shift 在数组的最前面删除一项原数组的最前面的一项会被删除shift的返回值是前面被删除的那一项indexOf 返回字符在数组中的索引如果字符不存在数组中，会返回-1sp...
2022-04-24 14:35:27
179
原创 对象object
内置对象：Array：用于在单独的变量名中存储一系列的值Date：用于操作日期和时间String：用于支持对字符串的处理Math：用于执行常用的数学任务，它包含了若干个数字常量和函数自定义对象：对象是带有属性和方法的特殊数据类型对象名.属性名称对象名.方法名称(参数表)var obj = {uname：'张三'，age：18，sex：'男'，sayHi：function（）{console.log（ ' hello! ' ）;}...
2022-04-22 17:25:55
182
原创 break、continue关键字以及Chrome调试
break关键字break关键字用于立即跳出整个循环（循环结束）。例如：<script>let arr=[10,20,30,40,50];for(var i=0;i<arr.length;i++){if(arr[i]>30){ *当arr[i]的值是40的时候，整个循环就终止了，不再继续循环了*break;}document.write(arr[i]+'<br>');}</script&g...
2022-04-21 15:51:42
246
原创 函数的学习
循环的优势： 解决重复操作 减少代码编写量，使代码结构清晰 增强代码的可读性函数的含义：程序的基本单元，是完成特定任务的代码语句块函数分类：系统函数（如parseInt() ）、自定义函数（如luck() ）函数的特征：实现一定的功能、可以返回一个结果 return、可以有参数...
2022-04-20 15:59:37
284
原创 while循环、do-while循环
while循环while语句可以在条件表达式为真的前提下，循环执行指定的一段代码，直到表达式不为真时结束循环。语法结构如下：while（条件表达式）{//循环体}执行思路：1、先执行条件表达式，如果结果为true，则执行循环体代码；如果为false，则退出循环，执行后面代码2、执行循环代码3、循环代码执行完毕后，程序会继续判断执行条件表达式，如果条件仍然为true，则会继续执行循环体，直到循环条件为false，整个循环过程才会结束案例：用while循环打印1~100以内(
2022-04-20 14:47:29
1100
原创 JS中的循环
for循环主要用于把某些代码循环若干次，通常跟计数有关系。其语法结构如下for（初始部分；条件判断；改变循环变量值）{循环操作}初始部分： 就是用var声明的一个普通变量，通常用于作为计数器使用条件判断： 就是用来决定每一次循环是否继续执行 ，就是终止的条件改变循环变量值 ：是每次循环最后执行的代码，经常用于我们计时器变量进行更新（递增或递减）for-in循环常用于对数组或对象的属性进行循环操作，其语法结构如下for (变量 in 对象) { ...
2022-04-19 22:14:16
305
原创 Javascrip的运算以及程序结构的了解
比较运算> < >= <= == === != ！==>和< 就是比较大小，比较的结果会以布尔类型展示，千万不要连续比较 因为这样只要有一个满足都会返回true>= 大于或者等于 只要有一个满足条件，就返回true<= 小于于或者等于 只要有一个满足条件，就返回true== 只比较值=== 不仅比较值 而且还比较类型!=（不等于） 只比较值 不...
2022-04-18 18:39:58
625
原创 初学JavaScript
什么是JavaScript？JavaScript是一种基于对象和事件驱动的脚本语言。JavaScript特点？交互、脚本语言、解释性语言、边执行边解释JavaScript组成：ecmascript(规范) bom(浏览器对象) dom(元素对象)ECMAScript是一种语法标准语法、变量和数据类型、运算符、逻辑控制语句、关键字、保留字、对象编码遵循ECMAScript标准BOM：Browser Object Model（浏览器对象模型）提供了独立于内容与浏览器窗口进
2022-04-17 00:01:07
471
原创 水平垂直居中的几种方式
行内元素实现水平垂直居中：text-align: center;（text-align: center只能实现文本的垂直居中）line-height: 50px;（line-height不能实现多行文本的垂直居中）padding:50px;（不固定高度的垂直居中 通过设置padding实现）使用display设置为table，配合样式vertical-align设置为middle来实现，如下：父元素{display：table；}子元素{display：table-c
2022-04-15 17:15:26
1315
原创 媒体查询、响应式布局、移动端兼容
媒体查询屏幕的查询类型mediatype有多种， 比如电脑屏幕 、打印机等sreen 就表示所有电子设备的屏幕print 表示打印机的屏幕all 用于所有设备关键字and 可以将多个媒体特性连接到一起，相当于“且”的意思not 排除某个媒体类型。相当于"非"的意思，可以省略only 指定某个特定的媒体类型，可以省略媒体特性（屏幕的尺寸）width 定义输出设备中页面可见区域的宽度min-width 定义输出设备中页面最小可见区域宽度max-width ...
2022-04-14 17:08:07
379
原创 弹性盒模型的补充
多根轴线的对齐方式 align-content属性值 说明flex-start 与交叉轴的起点对齐flex-end 与交叉轴的终点对齐center 与交叉轴的中点对齐space-between 与交叉轴两端对齐，轴线之间的间隔平均分布space-around 每根轴线两侧的间隔都相等。所以，轴线之间的间隔比轴线与边框的间隔大一倍stretch（默认值 ） 轴线占满整个交叉轴 ★ 子元素不设置高度或者高度autoorder 定义项目的排列顺序。数值越小，排列越靠前，默...
2022-04-13 17:21:39
96
原创 弹性盒布局
布局原理：flex是flexble Box的缩写，意为弹性布局，用来为盒状模型提供最大的灵活性，任何一个容器都可以指定为flex布局1、当我们为父元素设为flex布局以后，子元素的float、clear和vertical-align属性都将失效2、伸缩布局=弹性布局=伸缩盒布局=弹性盒布局=flex布局采用flex布局的元素，称为flex容器（flex container），简称‘容器’。它的所有子元素自动成为容器成员，称为flex项目（flex item），简称'项目'。总结flex布
2022-04-12 16:05:21
561
原创 css3动画
动画animation是由两个部分组成的：设置关键帧+调用关键帧浏览器支持属 性 名 IE Firefox Chrome Opera Safarianimation 10+ 5.0+ 4.0+ 12+ 4.0+设置关键帧（通过类似Flash动画的关键帧来声明一个动画）@keyframes spread {0% {width:0;}33% {width:23px;}66% {width:46px;}...
2022-04-11 17:51:06
465
原创 透明度以及CSS3的新特性
透明度：opacity:x；x的值为0~1，值越小越透明 ，可以写为opacity: .5;ie低版本支持filter:alpha(opacity=x)x值为0~100，值越小越透明CSS3过渡transition:要过渡的属性 花费时间 时间曲线 何时开始；1.属性：想要变化的CSS属性，宽度高度 背景颜色 内外边距都可以。如果想要所有的属性都变化过渡，写一个all就可以了。2.花费时间：单位是秒（必须要写单位）比如2s3.运动曲线： 默认是ease4.何.
2022-04-09 22:39:01
744
原创 定位的了解
为什么需要定位？1、某个元素可以自由的在一个盒子内移动位置，并且压住其他盒子。2、当我们滚动窗口的时候，盒子的固定屏幕某个位置的。所以：1.浮动也已让多个块级盒子一行没有缝隙排列显示，经常用于横向排列盒子2.定位则是可以让盒子自由的在某个盒子内移动位置或固定屏幕中某个位置，并且可以压住其他盒子。定位的组成定位：是将盒子定在某一个位置，所以定位也是在摆放盒子，按照定位的方式移动盒子。定位=定位模式+边偏移定位模式 position：属...
2022-04-08 14:40:11
366
原创 CSS的高级特效
2D位移：translate书写方式 transform:translate(tx,ty);tx 表示【x轴(横坐标)移动的向量长度】ty 表示【y轴(纵坐标)移动的向量长度】2D缩放：scale书写方式 transform: scale(1,1);scale(1,1)表示不放大也不缩小scale(2,2)表示宽度和高度放大了两倍scale(.5,.5)表示宽度和高度都缩小一倍☆缩小和放大的时候都是从中心开始的...
2022-04-07 15:09:56
332
原创 浮动的学习
什么是浮动？float 属性用于创建浮动框，将其移动到一边，直到左边缘或者右边缘触及包含块或另一个浮动框的边缘。语法如下：选择器{ float:属性值；}属性值 说明left 元素向左浮动right 元素向右浮动none （默认值）元素不浮动浮动的特性：1、浮动元素会脱离标准流（脱标）2、浮动的元素会一行内显示并且元素顶部对齐3、浮动的元素会具有行内块元素的特性（如果行内元素有了浮动，则不需要转换块级元素就可以直接给高度...
2022-04-06 16:05:39
247
原创 CSS3的渐变、向文本添加阴影、超出部分显示省略号
线性渐变：Linear Gradientsbackground:linear-gradients( to bottom,red,green)；（position 渐变方向 color1第一种颜色 color2第二种颜色 不给方向 默认是从上到下顺序 从第一种颜色渐变到第二种颜色 to right 从左到右 to right bottom 从左上角到右下角以此类推）如图：径向渐变 radial-gradient：background: radial-gradient(...
2022-04-05 19:57:16
493
原创 CSS3的圆角边框、盒子的阴影以及背景图片的设置
圆角边框：border-radius: 20px；（一个值表示四个角的大小都为20px）border-radius: 20px 50px；（两个值表示：第一个值表示左上角和右下角的圆角大小，第二个值表示右上角和左下角的圆角大小，*是对角关系）border:20px 30px 50px；（三个值表示：第一个值表示左上角的圆角大小，第二个值表示右上角和左下角的圆角大小，第三个值表示右下角的圆角大小）border-radius:20px 10px 30px 50px;（四个值表示：
2022-04-03 11:41:21
776
原创 HTML5的新增元素
<input type="email" name="emailname">电子邮箱地址文本框，提交表单会自动验证email的值<input type="url" name="urlname">网页的url，提交表单时会自动验证url的值 要按照这种格式来书写，网址前面要加http：http://www.baidu.com<input type="color" name="colorname">主要用于选取颜色的<input..
2022-04-01 14:10:37
216
原创 了解CSS3的高级选择器
高级选择器：p:first-of-type选择属性其父元素首个<p>元素的每个<p>元素p:last-of-type选择属性其父元素最后<p>元素的每个<p>元素p:only-of-type 选择属于父元素唯一的<p>元素的每个<p>元素p:first-chid选择属性其父元素的第一个元素的每个<p>元素p:last-chid选择属性其父元素的最后一个元素的每个<p>元素p:nth-chi
2022-03-31 15:06:52
166
原创 了解HTML5的新增网页元素以及属性
什么是HTML5?HTML5是用于取代HTML和XHTML的标准版本新特性、新的语义化标签，比如 header、footer、nav等等新的表单控件，比如 email、url、search用于绘画的 ：canvas 元素用于媒介回放的 ：video 和 audio 元素新增元素的书写方式如下：定义视频：<audio src="路径" controls loop muted></audio>controls (控制菜单) autoplay（自
2022-03-30 16:37:16
567
原创 盒子的内边距以及display的属性
内边距padding：上内边距padding-top右内边距padding-right下内边距padding-bottom左内边距padding-leftpadding:50px; （padding设置一个值 表示上右下左内边距全部增加50px）padding:50px 100px;（上下内边距为50px ，左右内边距为100px）padding：50px 60px 80px；（上内边距50px，左右内边距80px，下边距80px）padding：50px 60px 80px
2022-03-29 15:19:41
358
原创 盒子模型的学习
盒子边框的粗细和样式：border-width边框的粗细border-color边框的颜色border-style边框的类型简写：border：1px solid red； （顺序可以调换）border-width: 2px; 后面还可以跟以下属性：[thick(粗的边框)] [medium(中等粗细)] [thin(最细的)]设置上边框的粗细：border-top-width:30px;设置右边框的粗细：border-right-width: 30px;简写：bor
2022-03-28 15:30:36
270
原创 网页背景样式
插入背景图片： background-image:url(图片路径)background-repeat: no-repeat； 图片不平铺，只会显示一次background-repeat:repeat-x; 图片只沿水平方向平铺background-repeat:repeat-y; 图片只沿垂直方向平铺background-repeat:repeat; 图片沿水平和垂直方向平铺background-position:100% 100%;使用百分比表示背景的位置background
2022-03-28 15:06:27
108
原创 CSS文本修饰与超链接伪类
文本修饰以及垂直对齐方式文本修饰 text-decoration 有以下属性： 没有下划线 text-decoration: none; 文本的下划线 text-decoration:underline; 文本的上划线 text-decoration:overline； 文本删除线 text-decoration:line-through;垂直对齐方式 vertical-align 有以下属性：图片后面的文字居中对齐 vertical-align: middle;顶端...
2022-03-27 20:48:58
136
原创 css的字体属性和文本样式
CSS的字体属性有以下：字体 {font-family :宋体，楷书，"Times New Roman"} /**中文英文都可以，单词比较长的主要要用引号括起来。字体大小{font-size：12px；}字体粗细{font-weight： }
2022-03-25 15:34:14
478
原创 CSS的高级选择器（层次选择器和属性选择器）
层次选择器如下：后代选择器的语法规范：子选择器的语法规范：相邻兄弟选择器的语法规范：通用兄弟选择器的语法规范：属性选择器如下：E[atter]属性选择器：<style> li[id]{ background: red;}</style><body> <ol> <li id>111</li> <...
2022-03-24 15:06:53
151
原创 css的学习
css的样式和选择器行内样式：外部样式：导入外部样式：样式的优先级：css的选择器：标签选择器、类选择器 、id选择器标签选择器：p h1 div em 所有标签都是标签选择器类选择器：id选择器：...
2022-03-23 14:50:49
53
原创 表单标签
表单的组成：表单域 表单控件 提示信息表单域是一个包含表单元素的区域。在HTML标签中，<form> 标签用于定义表单域，以实现用户信息的收集和传递，将它范围内的表单元素信息提交给服务器。常用属性有：action 、method、name<form action=" 地址" methon="提交方式" name="表单域名称"></form>表单控件（表单元素）1、<input>标签用于收集用户信息<input type="属性值
2022-03-22 16:47:57
534
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人