- 博客(27)
- 收藏
- 关注
RSS订阅原创 JavaScript一些判断写法
例1：if else if else const fn =(status)=>{ if(status === 1.1){ console.log(1); }else if(status === 2){ console.log(2.2); }else if(status === 3){ console.lo...
2018-11-13 18:32:51
309
1
原创 短信验证功能
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表单注册</title> <style> body { margin: 0; paddin
2018-11-05 11:56:09
246
原创 react
React 是一个用于构建用户界面的 JAVASCRIPT 库。 React主要用于构建UI，很多人认为 React是 MVC 中的 V（视图）。 MVC:model view controller React的概念：组件 ，JSX ，virtual(虚拟) DOM ，Data Flow React的使用： 1.直接下载三个库： react.min.js 、react-dom.min.j...
2018-10-26 18:01:04
208
原创 export、export default、import区别:
1.export与export default均可用于导出常量、函数、文件、模块等， 2.然后在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名 from '' 的方式，将其导入，以便能够对其进行使用， 3.但在一个文件或模块中，export、import可以有多个，export default仅有一个 4.通过export方式导出，在导入时要加{ }，export...
2018-10-25 17:15:02
145
原创 CSS实现水平垂直居中
如何用CSS实现盒子的水平垂直居中在实际工作和面试中都常有出现，在此做一次总结： 1.定位，父相对，子绝对，返回自身宽高的一般。需要知道子元素的宽高 <style> *{ padding: 0; margin: 0; } .box{ width: 600px; height: 600px; background-color: #000; ...
2018-10-24 12:00:50
115
原创 flex布局
最近做支付宝小程序项目，用到了flex布局，为此，做一些总结记录; ## flex布局：弹性盒子布局。 display: flex; - 注意：使用Flex布局之后，里面的float、clear、vertical-align属性将失效 - Flex容器有以下6个属性 . ①flex-direction . ②flex-wrap . ③flex-flow . ④justify-cont...
2018-09-13 18:03:21
162
原创 做一些整理
position 1)relative 相对定位相对自身,不脱离标准流 2)absolute 绝对定位相对非静态定位的父级元素，脱离标准流 3) fixed固定定位相对浏览器，脱离标准流 怎样清除浮动？1)额外标签法 给父元素最后添加一个 块级子元素, 给这个子元素, 设置 clear: both; 2)overflow:hidden 给父元素设置overflow:hidde...
2018-08-30 17:38:04
123
原创 数组和字符串内置对象的总结
Array 数组 创建一个新的数组 var arr=new Array(); push() 从数组最后面增加一个或多个元素，原数组改变，返回值是这个数组的长度 pop() 从数组最后删除一个元素，原数组改变,返回值是被删除的元素\ unshift() 从数组的最前面增加一个或多个元素，原数组改变，返回值是这个数组的长度 shift() 从数组最前面删除一个元素，原数组改变,返回值是被删除的...
2018-08-30 17:20:19
195
原创 分别用css,js,jquery实现一个持续动画效果
1.使用css实现一个持续的动画效果 div{ width: 200px; height: 200px; /* 动画的元素一定要是定位的 */ position: absolute; background-color: green; /* 使用一个动画 */ animation: dong 1s infinite linear; } ...
2018-08-30 16:43:28
2152
原创 前端面试题整理
1工作中用到的前端优化： 用js的图片懒加载解决网站图片过多，一次性加载慢的问题 CSS、JavaScript代码压缩合并 使用CSS Sprint，雪碧图 精灵图 使用CND 使用打包工具,例如webpack 2原型链和继承：原型 构造函数 实例 prototype constructor _proto_ 3怎么样实现继承： call(...
2018-08-30 14:35:59
734
原创 Vue路由的使用
路由即：浏览器URL中的哈希值（# hash）与展示视图内容（template）之间的对应规则 路由就是一套映射规则（一对一的对应规则），由开发人员制定规则。 当URL中的哈希值（# hash）发生改变后，路由会根据制定好的规则，展示对应的视图内容 <style> /* 路由高亮，自动添加样式在此页面的链接导航上 */ .router-link-exact-active, ...
2018-08-01 10:00:28
164
原创 组件通讯
组件是一个独立封闭的个体，不能直接使用外部的数据，组件可以为自己提供数据，通过 data（）{return{msg：'...'} } 父组件到子组件 通过子组件 props: ['属性'] <body> <div id="app"> <father class="father"></father> </div>
2018-07-31 18:05:58
445
原创 Vue全局组件和局部组件
Vue实例中的配置项： data、computed、watch、methods 以及生命周期钩子函数(created,mounted)等Vue 全局组件 <body> <div id="app"> <home></home> </div> <script src='./vue.js'><
2018-07-30 17:26:37
1038
原创 Vue基础总结
Vue是什么？是一套构建用户界面(UI)的渐进式JavaScript框架 1.安装：`npm i -S vue` 2.引入：<script src="vue.js"></script> 3.HTML：<div id="app">{{ msg }}</div> 4：script： var vm = new Vue({el:'#app',data:{ms...
2018-07-30 16:54:49
174
原创 左侧固定，右侧自适应
方法一： <style> .box1{ width: 100px; height: 500px; float: left; background-color: red; } .box2{ margin-left: 100px; height: 500px; background-color: blue; } </style> <body> <div cl...
2018-07-30 09:38:30
147
原创 数组去重
用一行代码去重 [...new Set([1,2,3,1,'a',1,'a'])] var arr = [1, 2, 3, 5, 6, 7, 2, 3, 54, 2, 645, 1, 2, 64, 23, 42, 1, 342, 4, 24, 23, 1, 42, 42, 42]; //方法一: var newArr = []; for (var i = 0; i < arr.le...
2018-07-29 22:01:34
152
原创 算出字符串中出现次数最多的字符是什么，出现了多少次
<script> //算出字符串中出现次数最多的字符是什么，出现了多少次 var str = "adadfdfseffserfefsefseeffffftsdg"; var arr = str.split('') //1 . 将字符串切割成数组 var obj = {}; // 2. 创建一个空对象 // 3. 遍历数组，判断对象中是否存在数组中的值，如果存在值+1，不存在赋...
2018-07-29 21:39:50
1149
原创 字体图标的使用
阿里巴巴矢量图标库官网 1，首先百度iconfont,找到阿里巴巴矢量图标库官网(http://www.iconfont.cn/), 然后注册登录,或者用github登录也行。 2，查找自己需要的字体图标，加入购物车，下载代码到本地文件夹。 3，把下载的文件添加到项目中 <link rel="stylesheet" href="font_aqil4ao5abgldi/iconfont...
2018-07-29 10:53:25
192
原创 AJAX判断用户名是否存在
html:<body> <input type="text"><span></span> <script> //思路：当input框失去焦点的时候 //1. 使用ajax发送一个get请求，把输入的用户名传递到后台 //2. 应该获取到后端给我们的响应（yes/no），根据yes还是no显示对应的信息即可 va...
2018-06-08 20:13:53
3104
原创 C3新增的一些属性总结
C3的选择器： 1.关系选择器：ul>li子代选择器 ul li后代选择器 .now+li后一个兄弟为li的元素 .now~li后面所有为li的兄弟元素 2.属性选择器：li[属性||自定义属性 ='值'] li里面属性或者自定义属性=值的元素 li[属性] 所有有此属性的元素 ...
2018-06-06 10:07:29
3631
原创 BFC的一点总结
BFC:块级格式化上下文，它是一个独立的渲染区域，父盒子触发BFC，不允许子元素去影响外界元素； 触发BFC的情况： 1.overflow：hidden /auto / scroll 2.float:left float:right 3. display: inline-block /flex/table 4. position: absolute / fixed BFC作用： ...
2018-05-28 19:51:07
221
原创 表单验证
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding: 0; margin: 0;
2018-05-28 14:25:04
320
原创 自定义播放器
HTML：<div class="bgBox"> <div class="left"> <div class="video-box"> <video src="movies/movie01.mp4"></video> </div>
2018-05-27 21:27:29
993
原创 简单拖拽案例
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding: 0; margin: 0;
2018-05-27 20:05:10
419
原创 轮播盒子
HTML：<div class='nav'> <ul> <li class='color'>渡梵尘</li> <li>渡梵尘</li> <li>渡梵尘</li> <li>渡梵尘</li> &a
2018-05-27 11:22:39
647
原创 立方体
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding: 0; margin: 0;
2018-05-26 15:34:09
217
原创 案例1
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!--1.编写一个程
2018-05-26 15:23:40
229
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人