zoukankan      html  css  js  c++  java
  • DOM重点核心

    DOM:文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展标记语言(HTML或XML)的标准编程接口。

    W3C已经定义了一系列的DOM接口,通过这些DOM接口可以改变网页的内容、结构和样式。

    对于JavaScript,为了能够使JavaScript操作HTML,JavaScript就有了一套自己的dom编程接口。

    对于HTML,dom使得HTML形成一棵DOM树,包含文档、元素、节点。
    在这里插入图片描述
    我们获取过来的DOM元素是一个对象,所以称为 文档对象模型。

    关于dom操作,主要针对元素的操作。主要有创建、增、删。改、查属性操作、事件操作。

    1.创建

    1)document.write
    2)innerHTML
    3)createElement

    2.增

    1)appendChild
    2)insertBefore

    3.删

    1)removeChild

    4.改

    主要修改dom的元素属性、dom元素的内容、属性,表单的值等。
    1)修改元素属性:src、href、title等
    2)修改普通元素内容:innerHTML、innerText
    3)修改表单元素:value、type、disable等
    4)修改元素样式:style、className

    5.查

    1)DOM提供的API方法:getElementById、getElementByTagName
    2)H5提供的新方法:querySelector、querySelectorAll
    3)利用节点操作获取元素:parentNode、children、previousElementSibling、nextElementSibling

    6.属性操作

    1)getAttribute:得到dom属性值
    H5新增(ie11+)element.dataset
    2)setAttribute:设置dom属性值
    H5规定以data-开头为自定义属性
    3)removeAttribute移除属性

  • 相关阅读:
    为什么学微信小程序开发
    mac 上配置sublime text3插件
    获取元素的宽度和高度
    移动端页面SEO优化需要注意的10个要点
    gulp详细入门教程
    HTTP协议详解
    深入了解 Flexbox 伸缩盒模型
    移动前端之viewport
    如何设置“用eclipse开发时自动在顶端产生import”?
    认识 java JVM虚拟机选项 Xms Xmx PermSize MaxPermSize 区别
  • 原文地址:https://www.cnblogs.com/blooming247/p/13326569.html
Copyright © 2011-2022 走看看