JS基础知识补充和性能优化知识学习(CHROME小技巧)

1.尽量减少js操作dom节点，减少页面的重排和重绘，尽量在appendChild前面进行添加操作，使用文档碎片

window.onload = function(){
var oUl = document.getElementById('uploadFile');
console.time('hello');
for(var i = 0 ; i < 5000 ; i++){
var oLi = document.createElement('li');
oUl.appendChild(oLi);
}
console.timeEnd('hello');
}
window.onload = function(){
var oUl = document.getElementById('uploadFile');
var oFrag = document.createDocumentFragment();
console.time('hello');
for(var i = 0 ; i < 5000 ; i++){
var oLi = document.createElement('span');
oFrag.appendChild(oLi);
}
oUl.appendChild(oFrag);
console.timeEnd('hello');
}

2.chrome小技巧
当页面元素很多找不到固定页面时，可以使用ctrl+p尝试出搜索功能并使用

ctrl+o找到合适的行号

调出页面被浏览器隐藏的元素settings-->element-->Show user agent shadow DOM

ctrl+d选中当前单词的下一个匹配，并可以一键修改