js Flashcards
(41 cards)
如果想让事件由上至下
xx.addEventListener(‘click’, fn, true);
如果上下都有事件，想要执行上面事件后阻止下面事件？
event.stopPropagation();
open a link in js?
same window:window.location = url;new window:window.open(url);
how to break out of a forEach loop?
you can’t.but you could break out of a some/every by returning false.
zepto在requirejs引用的时候……
不能带$配对：define([‘zepto’], function() { console.log($)});
how to detect browser:
create a test element to see if there exists such a property, so we could detect if the browser is -webkit or -moz, and only use this one prefix instead of writing four to cover all:var testEl = document.createElement(‘div’);$.each(vendors, function(vendor, event) { if (testEl.style[vendor + ‘TransitionProperty’] !== undefined) { prefix = ‘-‘ + downcase(vendor) + ‘-‘; eventPrefix = event; return false; }});
how to use jQuery’s animation?
- 四个参数：properties(object), duration(1000), ease(string), callback2. 两个参数：properties(object), 其他设置参数(object), 比如duration，epecialEasing，complete……
how to test if an argument is plain object or not?
var a = [], d = document, o = {};typeof a; //objecttypeof b; //objecttypeof c; //objectjQuery.isPlainObject( a ); //falsejQuery.isPlainObject( b ); //falsejQuery.isPlainObject( c ); //true
tweenMax’s fromto?
TweenLite.fromTo(xx, 1.5, {width:0, height:0}, {width:100, height:200});
how to stop setInterval?
with clearInterval:var nameOfInterval = setInterval(function(){ if (xxx) { clearInterval(nameOfInterval); }, 100);
what to pay attention on tablet and mobile?
- notouch(roll over), -webkit-tap-highlight-color: rgba(0,0,0,0); * mobile横屏文字变大禁止：-webkit-text-size-adjust: none; * 视频不要太大，宽高，不然播放不了
String.replace?
“someString”.replace(/(xx)(yy)/, function(match, p1, p2, offset, string) { return [p1, p2].join(“ “);}match: 符合搜索条件的字段p1: 第一个括号里的符合字段p2: 第二个括号里的符合字段offset: p1的index numberstring: 整个string
用事件传送数据：
//set an anchor for future event binds (in order to transmit cross page data)window.anchor = {};$(anchor).on(“transmit”, function(){ return {};});$(anchor).trigger(“transmit”);或者这个锚点就可以直接用$(‘html’)，避免冲突，而且哪里都能取到。
requirejs grunt build, what would be compressed, and what would not?
只有写在main的define里，才会被压缩进来，在main里require的，文件会单独载入。
tweenMax有时候会闪一下
可能是因为某个动画设置了delay
what to be careful about with for..in loop?
- 用在object上：有可能会把继承来的property也iterate出来，所以若想只用这个object自己的property，就用hasOwnProperty。2. 它的iterate顺序是随机的，所以，用在array上可能会有很神奇的效果。array用forEach(e, i, a)for..in should not be used to iterate over an Array where index order is important. Array indexes are just enumerable properties with integer names and are otherwise identical to general Object properties. There is no guarantee that for…in will return the indexes in any particular order and it will return all enumerable properties, including those with non–integer names and those that are inherited. Because the order of iteration is implementation dependent, iterating over an array may not visit elements in a consistent order. Therefore it is better to use a for loop with a numeric index (or Array.forEach or the non-standard for…of loop) when iterating over arrays where the order of access is important.
careful, tweenMax and IE8?
- 控制上层div opacity变成0，下层会变化。上层div opacity变成1，下层不会变。2. 如果设置的css是%为单位，在TweenMax中设置的又是动画到某个数值（没有设置单位），那ie8会把它理解为同样的单位，%。解决：在TweenMax中指明，是某个px，而非直接写数值3. 有的时候，css已经设置了opacity：0，ie8就是不显示。这时候可以在js里加一个设置 opacity：.01，手动让它出现。
zoom/scale in IE8? (tweenmax)
use position: absolute, 因为它会用left，top来算.
ie8 and video tag:
IE8 不支持新的标签，比如video标签，所以videojs取dom src可能会出问题。解决： * 自己声明“我新建了标签喔” * 必须是在header里声明用html5.js/*! HTML5 Shiv vpre3.6 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed Uncompressed source: https://github.com/aFarkas/html5shiv */
how to use indexOf, and problem with it?
- [a, b, c].indexOf(a) ===> 02. ie8 doesn’t support that. needs to add it in js（已经加入config.js）if (!Array.prototype.indexOf) { …}
jQuery.each()
jQuery.each(arr, function(e, i) { //”this” would be arr}will jump out of the loop if returned “false”
jQuery: $dom.each()
$(‘li’).each(function( i ) {})如果是对dom object的直接each，就用jquery内置的each比较方便。 * 不过记得，如果里面有用到settimeout的话，里面的$(this)还需要用$that来替换，不然会指向$(window)
什么叫图片重绘？
chrome为了节省内存，在解码图片（将png、jpg按照某种规则绘制成像素点）后，如果过一段时间不需要用它，就会将其回收，下次出现还会再次解码。解决方案：用canvas，强制其不回收
setTimeOut是很神奇的生物
在很多个东西都需要settimeout的时候，用，即使t传入的是0，也会延迟。
