发表于 |

很久没更新内容了，最主要是人懒，(꒦_꒦) ！

今天开始总结这一年在工作中的点滴积累，已供以后查阅！

VUE 已经用了 1 年了，各个知识点的领域或多或少都有涉及，今天记录一下全局组建的实现和思路

组建的作用

个人总结的一句话： 可重复使用并抽象事件功能的代码块

阅读全文 »

发表于 |

1.window 加载时运行

1
2
3
4
5
6
7
8
9
10
11
function addEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            oldonload();
            func();
        };
    }
}

2.在目标元素后插入元素

1
2
3
4
5
6
7
8
function insertAfter(newElement，targetElement){
    var parent = targetElement.parentNote;//获取目标元素的父元素
    if(parent.lastChild == targetElement ){
        parent.appendChild(newElement);
    }else{
        parent.insertBefore(newElement,targetElement.nextSibling);
    }
}
阅读全文 »

发表于 |

DOM事件。事件的定义，就是文档和浏览器窗口发生的一些特定交互的瞬间。此文出自JavaScript高级程序设计一书对事件的定义

事件流

事件冒泡

事件冒泡是IE事件流，当点击一个按钮时是由内而外，就是事件点击焦点逐级向上

1
2
3
4
5
6
7
8
9
10

<!DOCTYPE html>
<html>
<head>
  <title>test</title>
</head>
<body>
  <div id="app"></div>
</body>
</html>

点击id为app事件顺序为，div body html document

阅读全文 »

发表于 |

单页应用如何得到多页应用的体验，VUE给我们提供了vue-router,此文不谈论如何安装如何使用，只记录下一些在实际运用中的知识点，所以如果您看到了此文在这之前你需要对vue-router有一定的了解，可能您还需要使用才会继续深入！点击这里去查看vue-router

router-view的使用时机

router-view是我们router进入后需要渲染的内容呈现的空间

我们来理解一下这个空间：

kongjian

阅读全文 »

发表于 |

面向对象（Object - Oriented）OO 是现在高级程序语言必备的技能，面向对象一般封装,继承,多态等特性，JavaScript不是高级语言，但也用自己的方式实现了面向对象的部分功能。

ECMA-262把对象定义为 无序属性的集合，其属性可以包含基本值、对象、或者函数—–JavaScript的对象在我们看来就是一个键值对，值可以是数据或函数。下面我们讨论在ES6之前的对象和继承的实现。

理解对象

我们来创建一个对象万能的Person

1
2
3
4
5
6
var person = new Object();
person.name = "lee";
person.age = 16;
person.sayName = function(){
  console.log(this.name);
}

变形后：

1
2
3
4
5
6
7
var person={
  name:'lee',
  age:16,
  sayName:function(){
    console.log(this.name)
  }
}
阅读全文 »

发表于 |

在很多情况下我都要对不同类型的数据做不同的处理

首先我们看看数据类型有那些

在JavaScript中数据类型分为2大类 基本类型 和 引用类型

基本类型

Underfine Uull Number String Boolean

检查是否是基本类型

typeof 就能搞定

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
var s = 'string';
var b = false;
var i = 1;
var u;
var n =null;
var o = new Object();

console.log(typeof s);
console.log(typeof b);
console.log(typeof i);
console.log(typeof u);
console.log(typeof n);
console.log(typeof o);

//string
//boolean
//number
//undefined
//object
//object

引用类型

引用类型通常叫做类（class），也就是说，遇到引用值，所处理的就是对象。
Object Function Array 等对象。

阅读全文 »

发表于 |

用vue.js写单页面应用时，会出现打包后的JavaScript包非常大，影响页面加载，我们可以利用路由的懒加载去优化这个问题，当我们用到某个路由后，才去加载对应的组件，这样就会更加高效，实现代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      component: resolve => require(['components/Hello.vue'], resolve)
    },
    {
        path: '/about',
        component: resolve => require(['components/About.vue'], resolve)
    }
  ]
})

如果对您有所帮助或者对博主有更多的话说，欢迎你去我的GitHub留下一个您的start和issues

前往LEE的github给他一个Start鼓励一下吧

发表于 |

在一次H5项目中img标签导致了IOS上内存溢出，后果就是APP崩溃

在一次次排查过程中终于定位到了IMG标签

我们来看看我们常用的媒体标签有：

audio

video

img

最终发现导致崩溃的原因是：

img 标签 在设置src后会去下载全部数据文件（这个当然没问题）

但是错误的发生就是在设置src图片时，我们将一个MP4文件设置成了img的src，我们这个文件有3个多小时，不难想象一台手机的内存只有那么多，肯定崩溃

特立此文以示警告！

如果对您有所帮助或者对博主有更多的话说，欢迎你去我的GitHub留下一个您的start和issues

前往LEE的github给他一个Start鼓励一下吧

发表于 |

最近在学习webpack3.0特记录一下

目录结构：

目录结构
dist : 打包后的文件了存储路径，在上线时提供的项目目录
node_modules ： 开发时依赖和插件安装目录，node提供
src ： 开发时代码编辑区
.babelrc: babel 配置
package.json ：node依赖包
postcss.config.js：css前缀配置文件
webpack_config.js : 单独提出的webpack配置文件
webpack.config.js：webpack工程配置文件

阅读全文 »