JS 之 Bom/Dom/节点

Posted 2021-02-09 pppoe

一、什么是BOM？

    浏览器对象模型

二、BOM中的顶级对象是什么？

    window

三、window下有哪些子对象？

    document location history navigator frames screen

四、如何实现跳转页面？

    window.location

    location.href

五、如何刷新页面？

    location.reload([true])

    history.go(0)

六、window下方法

    1. alert() : 警告框

    2. confirm() : 选择框

    3. prompt() : 提示输入框

    4. open() : 打开一个新窗口

    5. close() : 关闭当前窗口

七、计时器(延时器、定时器）

    间歇性计时器： setInterval(函数，毫秒数) clearInterval()

    一次性计时器： setTimeout(函数，毫秒数) clearTimeout()

八、什么是DOM?

    文档对象模型

九、如何获取页面元素对象？

    1. document.getElementById() 返回对象，失败，返回null

    2. document.getElementsByTagName() 返回伪数组

    3. document.getElementsByClassName() 返回伪数组，IE9以下不兼容

    function byClassName(obj,className){

        if(obj.getElementsByClassName){

            return obj.getElementsByClassName(className);

        }else{

            var arr = [];

            var eles = obj.getElementsByTagName(‘*‘);

            for(var i = 0,len = eles.length;i < len;i ++){

                if(eles[i].className === className){

                    arr.push(eles[i]);

                }

            }

            return arr;

        }

    }

    4. document.getElementsByName()

    5. document.querySelector() //IE8以下不兼容 返回对象

    6. document.querySelectorAll() //IE8以下不兼容

    7. document.documentElement //html

    8. document.body //body

十、如何创建节点对象？

    1. 元素节点对象： document.createElement()

    2. 文本节点对象： document.createTextNode()

    3. 文档碎片： document.createDocumentFragment()

十一、 如何修改节点对象

    父节点.replaceChild(new,old)

十二、如何删除节点对象？

    1. 父节点.removeChild(子节点)

    2. 节点.remove()

十三、如何克隆节点对象？

    节点.cloneNode([true])

十四、如何追加子节点？

    父节点.appendChild(子节点)

十五、常见节点及节点属性

                nodeName nodeType nodeValue

    元素节点： 元素名 1 null

    属性节点： 属性名 2 属性值

    文本节点： #text 3 文本内容

十六、滚动事件

    onscroll

    //垂直

    document.documentElement.scrollTop || document.body.scrollTop

    //水平

    document.documentElement.scrollLeft || document.body.scrollLeft