- 博客(54)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 Vue页面组件标题
1.npm install vue-wechat-title2.main.js中导入并注册import VueWechatTitle from 'vue-wechat-title'Vue.use(VueWechatTitle)3.在router-view标签上增加指令(v-wechat-title='$route.meta.title') 必须在路由配置中，增加一个meta...
2018-12-03 16:46:28
2227
原创 移动端 -- 点击输入框默认弹出数字键盘
应用场景：手机号、银行卡号等 <input type='tel' pattern='\d*' />
2018-12-03 15:43:28
4369
原创 移动端 -- 禁止微信浏览器物理返回键
需求：当完成一系列步骤之后，提交完成后，不想通过手机上的返回键返回到上一个页面，需要跳转到指定页面，这时候就需要禁止掉物理返回键解决：（此为Vue中的写法）export default { name: 'complete', methods: { routeTo () { this.$router.replace({name: '指...
2018-12-03 15:27:15
5451
原创 移动端 -- 禁止苹果微信浏览器的下拉回弹
需求：实现页面中有个可拖动的悬浮球问题：在ios中，由于微信浏览器存在下拉回弹的特性，所以悬浮球拖拽的时候会引起整个页面的拖动，所以需要禁止掉浏览器默认事件，这样在拖动悬浮球时就不会出现问题了解决办法：（1）最简单粗暴的方法，就是禁止掉浏览器整个页面的滑动document.body.addEventListener('touchmove', function (e) { ...
2018-12-03 13:57:35
8392
原创 项目常用js工具库
1、关于时间格式化的方法（1）时间格式处理方法/** * 格式化时间 * @param date 日期 * @param format 需要转出的格式 * @returns {*} */function dateTimeFormatter (date, format) { if (!date || date === '') { return '' }...
2018-08-03 16:43:28
4873
原创 css布局系列 -- (二）宽度或高度不固定垂直居中和水平居中
1.高度不固定-单个元素垂直居中<div class="box"> <div class="content">高度不固定</div></div>.box{ background: #f0f0f0; height: 400px; position: relative;}/*缺点：要用到 transform ，兼容性...
2018-06-28 17:52:40
1578
原创 css布局系列 -- （一）多个元素垂直居中和水平居中
1、多个元素水平居中<div class="box"> <span>1</span> <span>2</span> <span>3</span></div>body{ margin: 0;}html,body{ width: 100%;
2018-06-28 17:40:57
8330
原创 css布局--垂直水平居中
一般兼容性较好的垂直水平居中有三种：1.容器内元素为内联元素或内联块元素,并且只有单行文字时<div class="box"> <span>我是内联元素</span></div>.box { text-align:center; height:40px; line-height:40px; background:red;}2....
2018-06-28 17:24:34
236
原创 关于Vue-cli npm run build生产环境打包,本地不能打开问题
问题：Tip: built files are meant to be served over an HTTP server. Opening index.html over file:// won't work.解释：npm run dev是开发环境, npm run build是生产环境, 在开发环境完成代码和测试, 之后用生产环境生成代码,执行npm run build 命令后，会生成dis...
2018-05-18 10:06:18
28704
9
原创 vue-devtools 安装时npm run build 报错
最新版github上下载vue-devtools, npm run dev 报错，解决办法1、先去github上下载vue-devtools，下载好压缩包后解压2、进入解压目录，在命令行（当前目录下）输入npm install(cnpm install) 安装依赖。3、npm run build 后可以看到 shells => Chrome下出现build文件夹。注意：最最新版可能在bui...
2018-04-28 09:40:28
18447
5
原创 数组去重几种方法
第一种Array.prototype.remove1=function(){ for(var i=0;i<this.length;i++){ for(var j=i+1;j<this.length;j++){ if(this[i]==this[j]){ this.splice(j,1); j--; } } } ret
2017-11-06 17:39:17
702
原创 vue生命周期面试题
1、什么是vue生命周期？答： Vue 实例从创建到销毁的过程，就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、卸载等一系列过程，我们称这是 Vue 的生命周期。2、vue生命周期的作用是什么？答：它的生命周期中有多个事件钩子，让我们在控制整个Vue实例的过程时更容易形成好的逻辑。3、vue生命周期总共有几个阶段？答：它可以总共分为8个阶
2017-10-26 15:33:21
13613
原创 创建各种三角形-css
.triangle { width: 0; height: 0; border-top: 20px solid #EEB422; border-right: 20px solid #C0FF3E; border-bottom: 20px solid #A020F0; border-left: 20px solid #7CFC00; }
2017-09-21 10:56:20
330
原创 不同页面间传值的几种方法
1、url传值function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象 var r = window.location.search.substr(1).match(reg); //匹配目标参数 if(r != null) retu
2017-09-12 15:23:45
3611
原创 获取页面url地址的参数
function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象 var r = window.location.search.substr(1).match(reg); //匹配目标参数 if(r != null) return decode
2017-09-12 14:40:11
505
原创 表格-表头有斜线
*{ margin:0; padding: 0; } table{ border-collapse: collapse; border: 1px solid #000; width: 800px; margin: 20px auto; } table td{ border: 1px solid #000; he
2017-08-23 15:36:54
4915
原创 圆等分成三个扇形菜单
Document *{ margin: 0; padding: 0; } .box{ position: relative; width: 536px; height: 536px; border-radius: 50%; overflow: hidden; } .box .s1{ width: 400px; heigh
2017-08-23 15:31:10
1199
原创 圆点围绕圆旋转---css3
Document *{ margin: 0; padding: 0; } .box{ position: relative; width: 300px; height: 300px; border: 5px solid deepskyblue; border-radius: 50%; } .box i{ display: bl
2017-08-23 15:19:54
10784
原创 表单控件绑定v-model
v-model:负责监听用户的输入事件以更新数据.（1）文本Message is: {{ message }}（2）多行文本Multiline message is:{{ message }}（3）复选框一个复选框，可以绑定逻辑值{{ checked }}多个勾选，绑定到数组JackJohnMikeChecked names: {{
2017-07-04 16:24:52
3359
原创 非父子组件通信-$on和$emit
非父子组件通信：通过 event bus ，在一个组件创建时的钩子函数中监听 某个事件，而在需要与其进行通信的组件中触发这个函数，同时交换数据HTML： JS：（1）创建一个中转站，空的vue实例var eventBus = new Vue({});（2）//创建一个组件foo：去监听bar组件触发的函数，同时自己去触发bar组件的事件var foo = {
2017-07-04 11:04:31
3184
原创 父子组件通信-$emit
父子组件使用$emit和v-on时，子组件使用$emit触发，父组件在实例中v-on自定义事件监听。注意：父组件监听子组件触发的事件，不能用$on侦听子组件抛出的事件，而必须在模板里直接用v-on绑定。下面是官方文档给出的例子：HTML： {{ total }} JS：Vue.component('button-counter', { template: '
2017-07-04 10:39:24
9441
原创 父子组件通信-props属性
父组件通过props向下传递数据给子组件；组件实例的作用域是孤立的，子组件用props选项声明他期望得到的数据。字面量语法：值是字符串，显示出来是1+1，如果想要传递number数值，在message前面加上v-bind: //创建子组件 var componentChild = Vue.component('child',{ props:['message'],
2017-07-04 10:24:52
2003
原创 前端可做那些优化？seo？
性能优化：（1）减少http请求（解决办法：合并图片，合并js和css；图片较多的页面可以使用懒加载技术）。（2）尽量减少repaint和reflow（3）减少DOM操作（解决办法：减少对Dom操作的查询和修改，查询时可将其赋值给局部变量）。（4）使用JSON格式进行数据交换（在JSON中，有两种结构： 对象和数组。对象：var obj={"name":"darren","age"
2017-06-13 17:34:33
564
原创 2、如何给未知宽高的图片垂直居中？有几种办法？
（1）背景法.wrap{ width:300px; height:200px; background: url(../img/test.jpg) center center no-repeat; }(2) 图片外面用个p标签，通过设置line-height使图片垂直居中(兼容性较好) .wrap{ width: 300px; height:
2017-06-13 17:32:57
500
原创 js中的栈和队列
栈：先进后出（向一个栈插入新元素，称作入栈；它是把元素放到栈顶，成为新的栈顶元素；删除时先删除栈顶元素）用push入栈，pop出栈队列：先进先出（线性表，只允许在表前端进行删除，在表后端进行插入；插入操作是队尾，删除操作是队头）用unshift添加到队列，用pop从队列中移除
2017-06-13 16:53:51
520
原创 var、let和const的区别？
（1）const定义的是常亮，并且定义时必须初始化，因为之后值不能在改变；const a = 2;（2）var定义的变量可修改，如果只声明，不初始化，定义的变量值是undefinedvar a;alert(a);//undefined（3）let定义块级作用域，函数内部使用let，对函数外部无影响
2017-06-13 16:39:02
552
原创 闭包
1、function f1(){ var n=999; nAdd=function(){n+=1;console.log(n)} function f2(){ alert(n); } return f2;}var result=f1();result(); //999nAdd();//1000(这里函数作用域中的n时来自发f1函数下的变量n)result()
2017-06-08 17:40:40
296
转载 DOM操作——怎样添加、移除、移动、复制、创建和查找节点
（1）创建新节点 createDocumentFragment() //创建一个DOM片段 createElement() //创建一个具体的元素 createTextNode() //创建一个文本节点（2）添加、移除、替换、插入 appendChild() removeChild()
2017-05-19 11:11:49
507
原创 sublime Text安装nodejs插件遇到问题
网上教程的安装步骤：1、下载Nodejs插件，下载地址为：https://github.com/tanepiper/SublimeText-Nodejs下载zip压缩包后解压，文件名改为Nodejs2、打开Sublime Text3，点击菜单“Perferences” =>“Browse Packages”打开“Packages”文件夹，并将第1部的Nodejs文件夹剪切进
2017-05-17 18:18:23
1739
原创 http请求 -------- 请求头和响应头理解
一、先了解一下域名的组成？域名地址的组成：http:// www. abc.com : 8080 / scripts/jquery.js协议 子域名 主域名 端口号 请求资源地址当协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域、二、HTTP通信机制是在一次完整的HTTP通信过
2017-05-16 15:20:25
950
原创 css一些兼容问题
1、下拉框样式/*清除ie的默认选择框样式清除，隐藏下拉箭头*/select::-ms-expand { display: none; }//清除火狐和谷歌下的默认下拉三角，加上自己想要的背景图片select{ -webkit-appearance: none; -moz-appearance: none; -ms-progress-appearance
2017-05-15 17:39:22
298
原创 最近做项目遇到的棘手问题
问题1：在IE高版本浏览器上，测试搜索时调用ajax请求去搜索内容，但却没有显示数据，谷歌下能出来数据？解决办法：首先先对比他的请求头，响应头的区别，发现没有问题，可以考虑url地址的问题。最后发现是url中出现中文，zaiIE浏览器下不会解析中文，所以把url中的中文转成utf-8编码格式。例子：encodeURI(searchNameOrBed) ===》把搜索的字段转编码说
2017-05-15 17:31:34
1442
原创 js-时间的转换问题
1、时间戳 ==》年-月-日 时:分:秒function full_data_transfer(millisecond){ if(millisecond==null|| millisecond==undefined ||millisecond==''){ throw new error("没有定义输入参数"); }else{ if(!(typeof milli
2017-05-08 09:47:29
220
原创 js 常用的js校验
//身份证号验证function isCardNo(sId) { var aCity={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北",43:"湖南"
2017-05-03 15:39:33
429
原创 HTML知识点
1、样式表行间样式表：内部样式表:外部样式表:2、边框边框的方向：上右下左边框的形状：非矩形（可以做一个三角 形）3、背景重要：background-attachment 背景图是否滚动 fixed 固定在浏览器可视区域内 scroll 跟随滚动条滚动4、文字多行文字测量行高：（
2016-12-12 09:26:58
367
原创 字符串的一些方法和例子
1、常用的一些方法1、charAt()返回指定位置的字符串，默认返回位置0的字符，范围在0~字符串-12、charCodeAt()返回指定位置的字符的Unicode的编码3、String.fromCharCode()接收一个指定的Unicode值，返回一个字符串alert(String.fromCharCode(97,98,99,100));//abcd常用的字符的Unic
2016-12-07 16:35:00
2004
原创 dedecms基本概念和操作
基本概念：1、前台：网站用户打开网站看到的页面2、后台：网站维护人员，看到的界面，可以管理网站使用前的操作：1、删除织梦目录下面的install2、修改织梦系统默认的后台管理目录（后台管理的url地址）使用操作：添加网站分类：
2016-11-30 14:37:08
655
转载 ajax详解
Ajax就是异步的JavaScript和XML。（1）创建XMLHttpRequest对象var xmlhttp;if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); }else {// code for
2016-11-29 09:28:52
305
原创 js知识点总结
1、js的基本数据类型Number、String、Boolean、Null、Undefined还有复杂数据类型：Object（Array、Json等）2、js有哪些内置对象Object是所有JS中所有对象的父对象数据封装类对象：Object、Array、Boolean、Number、String其他对象：Function、Arguments、Math、Date、Re
2016-11-28 08:43:38
4208
1
原创 事件冒泡和事件捕获
事件冒泡和事件捕获示意图：一、事件冒泡实例：事件冒泡*{margin:0; padding:0;}window.onload = function(){ var div1 = document.getElementsByTagName('div')[0]; var oSpan = document.getElementsByTagName('span'
2016-11-25 11:13:18
375
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人