zoukankan      html  css  js  c++  java
  • Web

    1. 简介

    DOM(Document Object Mode)是一套web标准,地那一了访问HTML文档的一套属性、方法和事件

    其本质:

      网页 与 脚本语言 沟通的桥梁

      脚本语言通过DOM对象来访问HTML页面,从而改变文档的结构、样式和内容。

      当浏览器载入HTML文档时,他就会称谓document对象树。

    2. DOM对象

    (1)文档对象:整个HTML文档

    (2)节点对象:所有的HTML元素都是元素节点

    (3)属性对象:依附于元素节点,所有节点的属性都是节点

    (4)文本对象:文本插入到HTML元素是文本节点

    3. 查找元素

    (1)元素的id属性

      document.getElementsById(元素id值)

      Id唯一,返回唯一元素

    (2)元素的class属性

      documenr.getElementsByClassName(元素class值)

      返回值为一个元素列表

    (3)元素的标签名

      document.getElementsByTagName(标签名)

      返回值为一个元素列表

    (4)css选择器

      查找一个元素:document.querySelector(css 表达式)

      查找多个元素:document.querySelectorAll(css 表达式)

      在css选择器中,#表示元素的id  .表示元素的class属性

    4. 获取和修改元素属性

    (1)获取元素属性

      document.getElementByXXX("").属性名

      document.getElementByXXX("")。getAttribute(属性名)

    (2)修改元素属性

      document.getElementByXXX("").属性名 = 属性值

      document.getElementByXXX("").setAttribute(属性名,属性值)

    5. 获取和修改元素的内容

    (1)获取元素内容

      document.getElementByXXX("").innerHTML    包括HTML标签

      document.getElementByXXX("").innerText  不包括标签,纯文本

    (2)修改元素内容

      document.getElementByXXX("").innerHTML = new HTML    包括HTML标签

      document.getElementByXXX("").innerText = new Text 不包括标签,纯文本

    6. 修改样式

      document.getElementByXXX("").style.样式名=样式值

  • 相关阅读:
    element-ui upload 上传图片之前压缩
    字符串截取substring放法传参不同返回不同
    vue中对于图片是否正常加载的思考
    前端图片合成并下载
    vue中图相对路径引用本地图片
    js计算精度
    vue-cli定义全局过滤器
    js加减乘除运算丢失精度 前端计算金额带小数点精度丢失问题
    鼠标样式大全
    js两小时倒计时,剩余时间倒计时,倒计时
  • 原文地址:https://www.cnblogs.com/gotesting/p/9895002.html
Copyright © 2011-2022 走看看