- 博客(34)
- 收藏
- 关注
RSS订阅原创 vue-cli工作中常用的过滤器
在 .vue 组件中的使用示例：{{ string | trim(1) }} //去除所有空格，过滤器第一个参数为value//去除空格 type 1-所有空格 2-前后空格 3-前空格 4-后空格function trim(value, trim) { switch (trim) { case 1: return value.r...
2020-04-14 17:40:42
354
原创 jquery动画实现
jq动画1.显示隐藏-hide(time,fn) 隐藏 time:时间 fn：动画执行完毕后做什么-show(time,fn) 显示 time:时间 fn：动画执行完毕后做什么-toggle(time,fn) 互斥逻辑显示隐藏 time:时间 fn：动画执行完毕后做什么2.滑动显示隐藏通过改变元素高度实现滑动隐藏time:时间 fn：动画执行完毕后做什么-slideDown(...
2019-12-27 22:16:10
129
原创 jquery中css样式与dom操作
jq之css 样式$() 参数字符串 作用：选择器 创建dom元素 返回jq对象.css() 参数对象；作用；给html 设置css 样式.原理：给元素style属性提娜佳以下的API 参数为class值.addClass() 参数字符串：作用给html添加class 类名 返回jq对象.removeClass() 参数字符串 作用删除class类名（参数）返回jq 对象.tog...
2019-12-27 22:10:50
240
原创 ajax的认识及封装
ajax的初步认识交互语言 ajax作用：实现web浏览器与web服务器的交互过程，并更新部分网页内容（页面的局部刷新）交互：浏览器发送请求；服务器做出响应浏览器与服务的交互行为1：实例化ajax 对象。2：调用内部api 完成请求响应请求方式：get post两者区别：get 将请求参数拼接到url 地址上，然后传递儿给服务器；post 通过【请求体】 发送请求的数据；get...
2019-12-27 21:54:33
113
原创 js实现无缝轮播图
需要引用上文封装的动画库代码如下：CSS样式* { margin: 0; padding: 0; } div { width: 500px; margin: 0 auto; } #view { width: 500px; margin: 0 auto; height: 300p...
2019-12-27 21:44:04
185
原创 js动画封装
js动画封装凡是可以看到过渡效果的基本都可以用到js动画，都能引用<!-- ani() 作用：动画 给某个元素查看某个css 属性值 在某个时间中变化的过程。 el // 元素对象 str // css end // 结束动画值 time // 动画执行总时间 返回值为 '1' 表示动画执行完毕 ...
2019-12-27 21:35:38
182
原创 用正则编写密码强度
密码安全程度弱 ：全部为字母或者数字,或者密码长度小于6中 : 字母数字组成，或者字母特殊字符，或者数字和特殊字符强 : 字母和数字和特殊字符CSS样式 .pw_letter { margin-top: 5px; font-size: 12px; } .pw_letter label { ...
2019-12-27 21:30:21
662
原创 正则表达式
修饰符g: 全局匹配i: 匹配大小写m 多行收缩元字符正则表达式有两种基本字符 ：元字符 原义文本字符原义概念：表示代表本来文本的字符；元字符：在正则表达式中有特殊意义的字符.* + ? $ ^ | \ () {} [] \n \d \w \r\ Q \f \b \cX…字符类[]一般情况下，一个字符对应一个字符串特殊：需要配【某类】字符1：使用[]来构建简单的类2： 所...
2019-12-27 21:24:08
90
原创 dom简介
DOM基本功能：① 查询某个元素② 查询某个元素的祖先、兄弟以及后代元素③ 获取、修改元素的属性④ 获取、修改元素的内容⑤ 创建、插入和删除元素按照不同的类型来分，dom有不同的节点：文档节点、元素节点、属性节点、文本节点、注释节点，如图：HTML DOM 定义了用于 HTML 的一系列标准的对象，以及访问和处理 HTML 文档的标准方法。通过 DOM，可以访问所有的 HTML ...
2019-12-14 17:22:49
415
原创 dom实现类似淘宝的星级评分
星级评分本质上是两种星星图片之间的转换。代码如下（五角星(1).png是指空白五角星图，五角星.png是指选中的五角星图）： <div class="wrap"> <div class="score"> <img src="五角星(1).png" alt=""> <img src="五角星(1).png" ...
2019-12-14 16:56:10
213
原创 dom实现轮播图
轮播图是网站设计常用的一种功能，请看代码。css样式：.wraper{width: 300px;height: 200px;position: relative;}.wraper>img{display: none;width: 300px;height: 200px;}#pre{width: 30px;height: 50px;background-color...
2019-12-14 16:29:01
382
原创 递归实现数组或对象的深拷贝
一.首先认识什么是递归递归：在自己的函数内部调用自己。二.了解深拷贝深拷贝：深拷贝是指源对象与拷贝对象互相独立，其中任何一个对象的改动都不会对另外一个对象造成影响。三.分析实施步骤定义一个 deepCopy(data)，data 可能是数组也可能是对象。1: 判断data 是数组 对象 或者其他类型数据2：分别处理，如果是数据声明空数组，接收被拷贝数组中的数数据； data[i]...
2019-12-07 10:11:23
722
原创 js作用域的形成与分类
一.作用域的形成因为变量需要运行环境，这个环境叫做作用域1.全局作用域在浏览器或者程序刚开始运行时产生2.全局作用域销毁：在关闭浏览器或者关闭程序时a：我们声明的全局变量都是window对象下的属性b：js对象中最大对象是window，所有的数据都在window下活跃c：全局作用域最大对象就是window，每次改变变量的值都是给window属性重新赋值。window属性为声明的变量或者...
2019-12-07 09:47:53
754
2
原创 数组中数字排序
数组排序 for 循环 if 语句升序思路1.获取数组中每个值2.让每个值与数组中值比较3.声明一个变量保存最小值var arr=[3,5,9,45,80] var tmp;for(var i=0;len=arr.length,i<len;i++){ arr[i] for(var j=i+1;j<arr.length;j++){ if(...
2019-11-30 11:52:26
1040
原创 生成随机验证码
var vertify=‘abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789’ //生成6位数随机验证码//1.初始化验证码 空字符var res=''//求0-vertify.length-1中随机整数console.log(vertify.length)for(var i=0;i<6;i++){var ...
2019-11-30 11:46:47
109
原创 常用的数学对象和日期对象
数学对象：作用:为数学计算提供常量和计算函数应用：js 算法var num = 2.9;Math.floor() //向下取整Math.ceil() //向上取整Math.round() // 四舍五入Math.random() // 出现 0-1随机小数Math.max() // 返回最大数日期对象作用：获取当前时间date.getFullYear() //年date.get...
2019-11-30 11:42:18
188
原创 if else条件语句常用结构
1.if(判断条件){ 符合条件时执行代码 }else{ 不满足条件执行，可省略 省略作用：条件句不执行 直接虐过 } 2.嵌套结构:j通过逻辑，条件范围的缩短，筛选 if(条件1){ 条件1范围大于条件1.1 if(条件1.1){ }else{...
2019-11-23 11:39:34
1573
原创 parseint的转化规则
1.parseint() 空字符NaN （将其他类型转化为整数） 2.从第一个字符开始检索，忽略空格，如果第一个字符是数字，继续检索第二个 3.遇到非数字字符停止检索，返回检索结果 4.非数字字符 true false null undefined 对象 数组一律NaN 5.二 八 十六进制转化为十进制输出<script> var ...
2019-11-23 11:37:32
822
原创 运算符的优先级
小括号>算术运算符>比较运算符>逻辑运算符>赋值运算符口诀：1.小括号里2.全体单目排第二 ++ – ！3.乘法除法取余排第三，加减排第四4.移位（<< >>）排第五 关系（< > >=）排第六5等于不等于排第七6逻辑运算符排第八 &&优先||7.赋值排第九8逗号成员最低...
2019-11-23 11:34:13
117
原创 变量的两种数据类型
基本类型：string 字符串Number 数值型Boolean 布尔型undefined 未定义null 空引用类型：数组 []对象{}函数 function
2019-11-23 11:25:20
478
原创 变量的相关知识点
变量是可以改变的量 变量名不变，数据可变一个var 声明一个变量 几个var几个变量创建变量是可以省略var（不要使用）变量可以存储js的任意数据类型变量的作用：存储数据变量命名方式：1.禁止出现关键字if else break for return function2.禁止使用中文3.禁止在变量名中出现空格4.可以使用数字字母，下划线5.采用驼峰是命名 userNam...
2019-11-23 11:20:37
259
原创 js的初步了解
1. js语言写在scrip内部，或者xx.js文件中 2.js完成一个网站交互的语言 3.JavaScript是一种基于对象（Object）和事件驱动（Event Driven）并具有安全性能的脚本语言。使用这种语言的目的是：与Web客户交互作用，美化页面等。 对象 js是面向对象语言 js内置对象：学习每个对象是什么，怎么用 自定义对象：根...
2019-11-23 11:14:23
76
原创 浏览器特殊标志
*html *前缀只对IE6生效*+html *+前缀只对IE7生效@media screen\9{…}只对IE6/7生效@media \0screen {body { background: red; }}只对IE8有效@media \0screen,screen\9{body { background: blue; }}只对IE6/7/8有效@media screen\0 {body...
2019-11-11 22:43:26
371
原创 动画库
动画分析过程1.分析动画运动轨迹2.想一下那些css 属性可以实现注意的效果3.根据轨迹变化，进行百分比划分(不一定是等分)划分方式，找到几个特殊的[峰值]，在峰值和峰值之间进行区分4.在每个不同的百分比区间更改属性的值5.如果是渐进式，值越来越小，直到回到最初的状态 动画运动轨迹 常用的： 平移 旋转 拉伸 显示隐藏： 透明度<h1>展示自己的...
2019-11-11 22:41:06
116
原创 css交叉轴布局
交叉轴：主轴垂直方向，默认垂直 起点上面设置元素在交叉轴上的对齐方式flex-start 默认值 交叉轴起点flex-end 交叉轴末端center 居中baseline 文本内容 基线对齐(文本对齐)stretch 子元素不设置高度，拉伸子元素高度到父元素内容高度 align-items: center; align...
2019-11-11 22:39:02
1366
原创 浮动布局
浮动： 1.浮动是布局的一种方式：也是元素脱离文档流的方式 2.浮动 float 3.浮动范围：只能在父容器内部浮动，不能超出父容器 4.浮动后，相邻兄弟元素，均浮动，浮动后，会占据一个浮动位置 <div id="wraper" class="clearFix"> <div class="box one">&l...
2019-11-11 22:33:35
453
原创 布局中的绝对定位与相对定位
绝对定位相对祖籍元素中具有position,且值不为static的元素进行绝对定位如果所有祖籍元素都没有position元素，就相对body进行定位定位后，块元素变成行内块，脱离文档流，原来的位置被其他元素所占据 如何定位呢？ top：[定位元素]距离[相对元素]上面多远 left：[定位元素]距离[相对元素]左面多远 righ...
2019-11-11 22:32:01
262
原创 盒子模型
盒模型原理：对所有的盒子，在浏览器中所占据的空间进行计算盒子：只要在浏览器中占据位置的元素，都是我们计算的盒子->inline inline-block block盒子模型使用什么计算盒子在浏览器中占据的位置width height border margin padding 盒子分类：边框盒子(IE默认)和 内容盒子(谷歌默认) 边框盒子在浏览器中占据空间 = ...
2019-11-11 22:30:19
96
原创 布局类标签使用
布局类标签 1.作用：完成页面布局 2.一律为块元素 3.快速建立页面搭建，将划分的页面结构转化为元素结构 4.结合所有的CSS布局属性：以及 流式布局，进行布局 5.注意：能够利用流式布局就利用流式布局...
2019-11-11 22:28:34
367
原创 表单样式
表单类标签：1.所有与[数据]提交，保存有关的，通常都用[表单元素]2.表单元素，有很多默认的事件3.表单元素，有默认样式————> 清空默认样式4.其他元素，使用基本样式，可以实现表单效果type 表示 input的类型type = text 表示单行文本输入type = password 表示输入加密格式type = submit 一个按钮 提交 表示[提交事件]，提...
2019-11-11 22:27:47
160
原创 选择框
type = checkbox 选择框用途：将来只要主要可选择的 不论单选多选，只要判断元素的[checked]属性————> 值为true 表示选中 值为false 表示没有选中[js操作] checked 属性 表示被选中 单选：如何获取被选中的元素： ————> 判断 是否具有seleted属性 或者 seleted 的...
2019-11-11 22:26:28
235
原创 css表格样式
表格：有自适应功能 行：设置宽度无效，可设置高度，最小高度，最大高度 列：设置高度[无效]：可以设置宽度：最小宽度，最大宽度 注意：行 也有高度失效————解决方法，设置最小高度 列 宽度可能[失效]————解决方法，设置[最小宽度] 所有表格列的东西都写在table里。如果丛向滚动表格，用宽度数设置，解决：由于内容过多导致表格分布不...
2019-11-11 22:19:23
82
原创 列表类标签
我是第0001个列表项 我是第0002个列表项 我是第0003个列表项 我是第0004个列表项 我是第0005个列表项 我是第0001 我是第0002 我是第0003 我是第0004 我是...
2019-11-11 22:16:10
156
原创 浏览器默认布局方式
浏览器的默认布局方式————流式布局先从左往右，再从上往下,子元素在父容器内部的默认布局方式。所有的容器内部都有[流]容器内部 子元素 在[默认流中]，元素都是[默认特点]产生布局流的主要原因，因为元素本身的特点导致的。我是第一个块元素我是第二个块元素我是行我是a标签我是测试空间的第三个p我是span...
2019-11-11 22:11:28
430
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人