javascript基础学习笔记5

domtree

深度优先（加载一个标签后会在往标签里面找标签，纵向的）

reflow domTree重排
js改变dom节点：dom节点删除，增加
dom节点改变宽高，display：none ---> block
dom的offseLeft,offseTop

repaint 重绘 改颜色改图片背景会对一部分dom重绘

javascript 异步加载的三种方式

1.defer：异步加载，会等dom解析完毕在进行，只有IE可用，在内部可写代码。<script type='text/javascript' src='' defer='defer'/>
2.async：异步加载。会等dom加载完在进行，只能加载外部代码，不能在里面写js。
1.2执行时不阻塞页面
3.创建script，插入到dom中，加载完毕后callback

//添加异步加载的script
function loadScript(url, callback) {
    var script = document.createElement('script');
    script.type = 'text/javascript';

    if (script.readyState) {
        //IE(查看script加载状态)
        script.onreadystatechange = function () {
            if (script.readyState == 'complete' && script.readyState == 'loaded') {
                callback();
            }
        }
    } else {
        //等script加载完
        script.onload = function () {
            //Safria chorme firefox opera
            callback();
        }
    }
    //异步加载
    script.src = url;
    document.head.appendChild(script);

}

dom解析完在运行，写在head中
document.addEventListener('DOMContentLoded',function(){},false);