2021-05-19 DOM操作

web Apis 和JS基础关联性

    js基础阶段学习的是 ECMScript

     web   APIS  学习的DOM(页面文档对象模型)   BOM（浏览器对象模型）

API 和 Web  API

    API（应用编程接口）是一些预定义的函数，目的是提供应用程序与开发人员基于某软件或硬盘得以访问一组列程的能力，而又无需访问源码，或理解内部工作机制的细节。

简单理解： API是给程序员提供的一种工具，以便能更轻松的实现想要完成的功能。    

web API 是浏览器提供的一套操作浏览器功能和页面元素的API（BOM和DOM）。 很多都是方法（函数）

1. DOM

    1.     文档对象模型，是W3C组织推荐的处理可扩展标记语言的标准编程接口。

    文档：一个页面就是一个文档 DOM中使用 document表示

    元素 ： 页面中所有标签都是元素，DOM中使用element表示

    节点 ： 网页中所有内容都是节点，DOM中使用node表示

    2. 获取特殊元素（body , html）

        document.body //返回body元素对象

        document。documentElment   //返回html元素对象

    3. 事件三要素  事件源   事件类型   事件处理程序

        （1）事件源 ： 事件被触发的对象

        （2）事件类型 ： 如何触发

        （3）事件处理方式 ： 是通过函数赋值的方式完成

    4. 有事件  就有执行事件

        （1） 获取事件源

        （2）注册事件

        （3）添加事件处理程序

    5.改变元素的内容

        element.innerText

        从起始位置到终止位置的内容，但它去除html标签，同时空格和换行也会去掉

        element.innerHTML

        从起始位置到终止位置的全部内容，包括html标签，同时保留空格和换行

    6. 样式属性操作

        element.style  行内样式操作

        element.className  类名样式操作

            注意：

                1.  如果样式修改较多，可以采取操作类名方式更改元素样式    

                2. 使用className来操作元素类名属性

                3. className 会直接更改元素的类名 ， 会覆盖原先的类名。

开关灯
  开关灯

    

   

        

        请输入6~16位密码