- 博客(21)
- 收藏
- 关注
转载 vue的双向绑定原理及实现
原理:vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的我们先来看一下通过控制台输出一个定义在vue初始化数据上的对象结构是什么样的var vm = new Vue({ data: { obj: { a: 1 } }, created: function () { console.log(this.obj); }});结果:我们可以看到属性a有两个相对应的g.
2021-07-27 15:57:03 1770
原创 vue @hook技术总结
父组件监听子组件的生命周期,假设现有parent.vue和child.vue方法一:是我们的常用方法// Parent.vue<Child @mounted="doSomething"/>// Child.vuemounted() { this.$emit("mounted");}方法二:在父组件引用子组件时通过 @hook 来监听// Parent.vue<Child @hook:mounted="doSomething" ></Chil.
2020-09-18 16:39:33 1689
转载 HTML5 离线缓存-manifest
HTML5 离线缓存-manifest什么是Cache Manifest首先manifest是一个后缀名为minifest的文件,在文件中定义那些需要缓存的文件,支持manifest的浏览器,会将按照manifest文件的规则,像文件保存在本地,从而在没有网络链接的情况下,也能访问页面。当我们第一次正确配置app cache后,当我们再次访问该应用时,浏览器会首先检查manifest文件是否有变动,如果有变动就会把相应的变得跟新下来,同时改变浏览器里面的app cache,如果没有变动,就会直接
2020-09-02 10:25:50 522
原创 几个兼容性问题小结
1、css样式问题描述:如果元素本身是内联元素,把它的display属性设置为inline-block时,所有浏览器都是支持的。 如果元素本身是块级元素的,把它设为display:inline-block; ie6/ie7/ie8/ie9都是不支持的。解决方案:在css中改变元素的行块级时,如下示例display:inline-block;*display: inline;/*兼...
2019-01-22 16:42:43 548
原创 js实现搜索框模糊查询
需要给input框绑定一个onChange事件function inputChange(e) { var queryList = this.props.course.queryList; var list = []; var val = e.target.value; if (queryList != undefined &&...
2018-04-02 17:28:43 9940
原创 js递归遍历数组获取所有的叶子节点
var arr=[];function queryList(json,arr) { for (var i = 0; i < json.length; i++) { var sonList = json[i].sonList; if (sonList.length == 0) { arr.push(json[i]); ...
2018-04-02 17:22:53 10324 3
转载 微信扫描打开app下载提示用户打开浏览器进行下载
1.介绍 将打包好的apk文件部署到服务器,把下载页面的URL通过草料二维码或根据url代码生成一个二维码,由于微信对apk文件经行了屏蔽,所以需要提示用户微信内无法下载,请点击左上角按钮,选择在浏览器中打开进行下载等提示。那么该如何判断用户是否是用微信浏览器呢? 我们知道 js 可以通过 window.navigator.userAgent 来获取浏览器的相关信息,比如:...
2018-02-24 14:32:14 6933
转载 小技巧css解决移动端ios不兼容position:fixed属性,无需插件
移动端开发仿app头部底部固定设置position:fixed,android2.2以上已经实现。但是在ios8以下系统,当小键盘激活时,都会出现位置浮动问题。如图:如何解决:查阅资料之后想到一下几种解决方法1,使用position:absolute模拟<script type="text/javascript"> window.onscroll=function(){ ...
2018-02-24 09:49:22 579
转载 HTML5 video 标签浏览器兼容问题
小示例代码地址:https://github.com/danhuan/video-demo IE8、火狐、谷歌测试通过。使用需要注意的问题:1.多种格式视频不可以只有MP4格式,一定要引入Ogg格式视频,否则在火狐上会不兼容报错。 推荐个不错的视频格式转换器,下载地址 :http://download.csdn.net/detail/danhuan/99059422.引入html5media.js...
2018-02-24 09:35:31 19339
转载 HTTPS相关原理
在互联网安全通信方式上,目前用的最多的就是HTTPS配合SSL和数字证书来保证传输和认证安全了。本文追本溯源围绕这个模式谈一谈。1 名词解释首先解释一下上面的几个名词:· HTTPS:在HTTP(超文本传输协议)基础上提出的一种安全的HTTP协议,因此可以称为安全的超文本传输协议。HTTP协议直接放置在TCP协议之上,而HTTPS提出在HTTP和TCP中间加上一层加密层。从发送端看,这一层负责把H...
2018-02-23 14:23:05 283
转载 React生命周期及事件详解
一、组件的详细说明和生命周期组件的详细说明当通过调用 React.createClass() 来创建组件的时候,你应该提供一个包含 render 方法的对象,并且也可以包含其它的在这里描述的生命周期方法。renderReactComponent render()render() 方法是必须的。当调用的时候,会检测 this.props 和 thi
2018-02-07 15:47:29 489
转载 H5实现调用本地摄像头实现实时视频以及拍照功能
getUserMedia APIHTML 5 的getUserMedia API提供了访问媒体的能力, 基于该特性, 开发者可以不依赖任何浏览器插件下去访问视频和音频等设备.旧版API : navigator.getUserMedia 新版API : navigator.mediaDevices.getUserMedia旧版语法:getUserMedia(con
2018-02-07 09:44:56 9858
转载 前端特效:使用js实现奇幻水母效果
cloth html { overflow: hidden; touch-action: none; content-zooming: none;}body { position: absolute; margin: 0; padding: 0; width: 100%; height: 100%; background: #000;}canvas {
2018-01-25 16:29:10 1126
转载 移动端网页滑动到底部
移动端网页滑动到底部触发事件 .m-test {height: 2000px;background: green;} var flag=1;var rgb = 0;$(window).bind("scroll", function () { if(getScrollHeight() < getDocumentTop(
2018-01-25 15:39:42 1711
原创 常用的正则表达式汇总
1、校验数字的表达式1 数字:^[0-9]*$ 2 n位的数字:^\d{n}$3 至少n位的数字:^\d{n,}$ 4 m-n位的数字:^\d{m,n}$ 5 零和非零开头的数字:^(0|[1-9][0-9]*)$ 6 非零开头的最多带两位小数的数字:^([1-9][0-9]*)+(.[0-9]{1,2})?$ 7 带1-2位小数的正数或
2018-01-24 16:24:04 321
原创 各类证件类型的格式校验
1、身份证校验function isCardID(sId) { var that = this; var aCity = { 11: "北京", 12: "天津", 13: "河北", 14: "山西", 15: "内蒙古", 21: "辽宁", 22: "吉林", 23: "黑龙江", 31: "上海",
2018-01-23 14:06:57 13315
原创 拖拽排序插件sortable
简介Sortable.js是一款轻量级的拖放排序列表的js插件(虽然体积小,但是功能很强大)下载地址:https://github.com/RubaXa/Sortable官方DEMO:https://rubaxa.github.io/Sortable/特点支持触屏设备和大部分浏览器(IE9以下的就不支持了,原因都懂得)可以从一个列表容器中
2018-01-16 15:44:46 2897 1
转载 前端实现图片懒加载,提高用户体验
定义图片懒加载又称图片延时加载、惰性加载,即在用户需要使用图片的时候加载,这样可以减少请求,节省带宽,提高页面加载速度,相对的,也能减少服务器压力。 惰性加载是程序人性化的一种体现,提高用户体验,防止一次性加载大量数据,而是根据用户需要进行资源的请求。实现懒加载的难点在于确定某张图片是否是用户需要的资源,在浏览器中,用户需要的是可视区内的资源,因此我们只需要判断图片是否
2018-01-16 14:49:11 548
原创 sass知识点整理
sass 有两种后缀名文件:一种后缀名为 sass,不使用大括号和分号;另一种后缀名为 scss ,这种和我们平时写的 css 文件格式差不多,使用大括号和分号。建议使用后缀名为 scss 的文件,以避免 sass 后缀名的严格格式要求报错。1、使用变量sass使用$符号来标识变量example:$nav-color: #F90;nav { $width: 100
2018-01-15 09:41:48 409
原创 js控制android原生返回按钮
js是无法直接监听物理返回键的,但是我们可以用HTML5的 History 新 API pushState 来曲线监听 Android 设备的返回按钮原理:在页面加载后往历史记录写入一个 state, 并监听 popstate 事件, 如果返回按钮被按下, 则会触发 popstate, 比对到触发的 state 跟写入的一致, 则认为返回按钮被按下了.Example
2018-01-12 17:26:17 4684
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人