至于未来会怎么样 反正路还长 天总会亮

Life is a journey, not a destination, care should be the scenery along the way and the mood to see the scenery.

个人博客
  • ...
     前端 浏览(7)  tangzihan ++阅读原文
    JS防抖与节流实现
    引入 我们在对窗口的resize、scroll进行事件监听时,可能会导致事件处理函数被无限制调用,这样做会增加浏览器负担,如果事件处理函数有AJAX的话会造成无限次请求,给服务器也带来了负担。 如下例 var i = 1; wi...
  • ...
     前端 浏览(9)  tangzihan ++阅读原文
    JS懒加载实现
    原理 服务端渲染后的图片地址并不立即赋给`img`标签的`src`属性,而是赋给自定义属性如`data-src` 当`img`标签呈现在当前浏览器可视窗口时,动态设置`img`标签的`src`属性 相关API document.documentElement.cl...
  • ...
     前端 浏览(12)  tangzihan ++阅读原文
    jQuery实现轮播效果
    HTML结构 Document { padding:0; margin:0; text-decoration: none; } body{ / padding:20px; / }...
  • ...
     前端 浏览(46)  tangzihan ++阅读原文
    jQuery实现回顶部效果
    暴躁滚动 $('html,body').scrollTop(0) 平滑滚动 $(' top').click(function(){ //滚动总距离 var $page = $('html,body') var distance = $('html').scrollTop() + $('body').scro...
  • ...
     前端 浏览(10)  tangzihan ++阅读原文
    关于scrollTop()/scrollLeft()兼容问题
    在chrome中获取滚动条的垂直偏移 console.log($(document.documentElement).scrollTop()) 但是上面代码在IE中不生效 在IE中是这样获取的 console.log($(document.body).scrollTop()) 要解决两个兼容问题很...
  • ...
     前端 浏览(10)  tangzihan ++阅读原文
    Web Workers
    引入 H5规范提供了js分线程的实现,取名为Web Workers他是HTML5提供的一个JavaScript多线程解决方案,我们可以将一些大计算量的代码交由web Worker运行而不冻结用户界面 但是子线程完全受主线程控制,且不得操作DOM,...
  • ...
     前端 浏览(20)  tangzihan ++阅读原文
    闭包的缺点与解决办法
    我们知道闭包延展了局部变量的生命周期,使得外部操作局部变量成为可能,一般来讲函数在调用执行后函数就会被释放,但如果函数中产生了闭包,就会导致函数执行完毕后,函数内部的局部变量没有被释放,使得占用内存时...
  • ...
     前端 浏览(13)  tangzihan ++阅读原文
    每天20个灵魂拷问系列二
    二十一、es5中是如何定义一个函数模块 示例 假定函数模块为Promise.js / 自定义Promise函数模块 / (function (window){ function Promise(executor){ } //向外暴露Promsie函数...
  • ...
     前端 浏览(12)  tangzihan ++阅读原文
    每天20个灵魂拷问系列一
    一、怎么让一个不定宽高的盒子 垂直水平居中? 这里给出两种解决办法 第一种使用css方法 父元素 .box{ display: table-cell; text-align: center; vertical-align: middle; width: 300px;...
  • ...
     前端 浏览(10)  tangzihan ++阅读原文
    手写Promise
    先来看一个最基本的Promise let p = new Promise((resolve,reject)=>{ setTimeout(function(){ if(false){ resolve('hello word') }else{ reject('hell...