event事件参数时效性

如下代码,在触发事件后,我们进行了其他操作,比如ajax和setTimeout等,过段时间,虽然还是同一个变量,但是其中的currentTaget就不见了.假如要延迟使用currentTarget属性,必须先存储下来,避免被消除掉.
1
2
3
4
5
6
7
function mouseclick(e){
console.log(e.currentTarget);
//ajax setTimeout等
setTimeout(function(){
console.log(e.currentTarget);
},1000);
}

#bug及解决方法

  • firfox 不支持background-position-x/y,最好使用background-position设置背景图

#CSS

  • div多余高度
    • div内包含inline-block类型空元素时,div总是比内部元素高3px,当div是页面最下方元素时,即使固定div高度,其下方也会多3px。解决办法:将div的overflow设置为hidden
    • div内包含img时,div可能会比img高度高3px。解决办法:设置img的block元素或者vertical-align:middle;

在IE8中书写注意

  • {“classname”: a > b} 这种结构,类名称可以带引号,其他{}标签中,不能带有引号

  • dom.outerHTML 适用与IE9+浏览器,不兼容ie8

  • riot循环中的子模板在ie8下会出问题: 解决方法:mount之后,获取[riot-tag]并且inlineHTML为空的节点手动mount一次

语法图(铁路图)的解析实现

使用js分析简单的数学算式

编辑器中当前内容及替换内容

gulp-riot-css中媒体选择器bug及css格式化

算法题:兔子和萝卜

原题: <img src="img/tuzi.jpg" width="400" height="200">
另外: 假如是200根萝卜结果是多少呢?假如是任意根萝卜结果是多少?

算法题:有一个数组,里面的数除了其中一个只出现一次外,其他的数都出现了两次。找出这个数。

要求时间复杂度O(n),空间复杂度O(1)

nodejs中一个文件引入另一个文件,计算新的文件位置

1
var newPath = path.join(oldFile.base, src);

javascript的数组排序函数中参数的返回值

>
arrayObject.sort(sortby)
参数 描述
sortby 可选。规定排序顺序。必须是函数。
返回值
对数组的引用。请注意,数组在原数组上进行排序,不生成副本。
说明
如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,首先应把数组的元素都转换成字符串(如有必要),以便进行比较。
如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下:
若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
若 a 等于 b,则返回 0。
若 a 大于 b,则返回一个大于 0 的值。

10行 JavaScript 实现文本编辑器

arguments参数是否可以更改

平时arguments和平常变量一样可以修改,修改后对应变量也会被修改。
严格模式下arguments列表修改不会报错,但是修改后arguments列表值会改变,参数中的值不会改变。另外严格模式下不能为arguments直接赋值。
1
2
3
4
5
6
7
8
9
"use strict";
function test(a){
arguments[0] = 1;
console.log(arguments[0]);
console.log(a); // 严格模式下姜维
arguments = 'test'; // 严格模式下将出错
console.log(arguments);
}
test(0);

快速排序 dev/quicksort.js

git clone时提示ssl错误

1
2
3
4
5
6
7
8
今天用百度云clone git项目时,报了以下错误:
fatal:unable to access ': SSL certificate problem: unable to get local issuer certificate
这里其实是电脑没有安装对应的ca证书,所以无法通过https连接到git服务器。
这里通过设置git的ssl验证跳过了这个错误(win下):
git config --global http.sslVerify false
之后再进行 git clone,就可以下载百度云的git项目了。

ie9 @media query 不起作用

增加meta标签在所有的meta之前

requirejs

  • baseUrl优先级高于data-main
  • .js结束,/开始,包含http:,https 将不使用baseUrl

config

1
2
3
4
require.config({
urlArgs:'_v='+'@@timestamp' // 添加时间戳
baseUrl:
});

r.js打包

  • 避免循环依赖
  • 避免打包:

##win7安装mean.io

  • 安装git并配置path(bower的dependence问题)
  • node npm
  • ms2012并配置全局参数npm config set msvs_version 2012 –global
  • 安装mean
  • 其他 sublime中terminal,不能执行git命令

casper使用

  • 安装phantomjs v2.0
  • 下载casperjs v1.0.4,设置casperjs\batchbin到环境变量path
  • 错误:Couldn’t find nor compute phantom.casperPath, exiting; 在bin\bootstrap.js中加上代码

    1
    2
    3
    4
    var system = require('system');
    var argsdeprecated = system.args;
    argsdeprecated.shift();
    phantom.args = argsdeprecated;
  • 输出中文乱码问题,添加代码: phantom.outputEncoding=”GBK”;

使用phantomjs进行前端测试

  • 下载文件
  • 设置执行文件到环境变量path

Hello World!

1.创建hello.js

1
2
console.log('Hello, world!');
phantom.exit(); //终止phantom程序

2.执行命令 phantomjs hello.js

下载页面并保存页面渲染图

1
2
3
4
5
6
7
8
var page = require('webpage').create();
page.open('http://example.com', function(status) {
console.log("Status: " + status);
if(status === "success") {
page.render('example.png');
}
phantom.exit();
});

下载速度

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
var page = require('webpage').create(),
system = require('system'),
t,address;
console.log(system.args);
if(system.args.length === 1){
console.log('Usage: loadspeed.js <some url>');
phantom.exit();
}
t = Date.now();
address = system.args[1];
page.open(address,function(status){
if(status !== 'success'){
console.log('Fail to load the address');
} else{
t = Date.now() - t;
console.log('Loading '+ system.args[1]);
console.log('loading time ' + t + 'msec.');
}
phantom.exit();
});

代码执行

在页面上执行代码需要使用evaluate函数,这是个沙箱函数,不能获取页面上的js对象.

js总结

js优化

js知识点

  • hasOwnProperty
  • instanceOf

#js数组

  • join 所有元素转为字符串,默认使用连接符逗号”,”
  • reverse 颠倒数组中的元素顺序(修改原数组)
  • sort 元素排序(修改原数组)
  • concat 链接数组
  • slice 返回子串(负数表示倒数第几个元素)
  • splice 从数组中删除元素、插入元素(修改原数组)
  • push和pop push尾部添加元素,pop头部删除元素
  • unshift和shift unshift头部添加元素,shift头部删除元素
  • toString和toLocalString

#js数组 ECMAScript5中的方法

  • forEach
  • map
  • filter
  • every和some
  • reduce和reduceRight
  • indexOf和lastIndexOf

#js函数

#jquery

  • 事件
    • live已取消
    • delegate/undelegate
    • bind: click,mouseover,input,prototypechange
  • 动画
    • fadeIn/fadeOut
    • slideDown/slideUp
    • animate({params},speed,callback)

#ajax:XMLHttpRequest

  • open
  • send
  • abort

#js模块加载器

  • requirejs(AMD)
  • seajs
  • commonjs

#js 片段

  • 滚动加载
    var clientHeight = window.document.body.clientHeight;
    var scrollTop = window.document.body.scrollTop;
    if ((clientHeight + scrollTop) > window.document.body.scrollHeight - 20) {
        return false;
    }
    //动态实现内容