zoukankan      html  css  js  c++  java
  • JS 之 Bom/Dom/节点

    一、什么是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
  • 相关阅读:
    前端展示(四)
    小谢第66问:页面关闭鼠标光标
    小谢第64问:nuxt项目中增加百度分析统计
    js 判断当前是手机还是电脑
    布谷鸟自定义教程
    vs code常用插件及配置
    小程序几件小事儿
    删除 json 数据中的某一项
    小程序图片预览
    小程序 navigator 取消点击效果
  • 原文地址:https://www.cnblogs.com/pppoe/p/10389407.html
Copyright © 2011-2022 走看看