首页 > 其他分享 >DOM概述和DOM的Document对象获取Element方法

DOM概述和DOM的Document对象获取Element方法

时间:2022-10-30 09:55:25浏览次数:71  
标签:DOM 对象 Element 获取 文档 Document

DOM概述

W3C  DOM  标准被分为3个不同的部分:

  核心 DOM - 针对任何结构化文档的标准模型

    Document:文档对象

    Element:元素对象

    Attribute:属性对象

    Text:文本对象

    Comment:注释对象

  XML DOM - 针对XML文档的标准模型

  HTML DOM - 针对HTML文档的标准模型

核心DOM模型:

  Document:文档对象

  Element:元素对象

  Node:节点对象,其他5个的父对象

HTML DOM

DOM的Document对象获取Element方法

Document:文档对象
  1.创建(获取):
    1.window.document
    2.document
  2.方法:
    1.获取Element对象:
      1.getElementById:根据id属性值获取元素对象。id属性值一般唯一
      2.getElementsByTaName():根据元素名称获取元素对象们。返回值是一个数组
      3.getElementsByClassName():根据Class属性值获取元素对象们。返回值是一个数组
      4.getElementsByName():根据name属性值获取元素对象们。返回值是一个数组
    2.创建其他DOM对象:
  3.属性

 

标签:DOM,对象,Element,获取,文档,Document
From: https://www.cnblogs.com/wsfj/p/16840543.html

相关文章

  • 使用vue、elementUI开发一个js SDK
    目录背景介绍实操步骤初始化项目1.初始化vue项目2.查阅vue-cli构建目标内容3.具体操作步骤1.在package.json文件中添加命令2.添加入口文件背景介绍本文主要介绍使......
  • document.ready和window.onload的区别
    document.ready和window.onload的区别milletmi关注2018.12.2114:01:18字数207阅读2,717页面加载完成有两种事件一、document.ready,表示文档结构已经加载完成(......
  • JavaScript中window.onload和document.onload有什么区别?
    JavaScript中window.onload和document.onload有什么区别?document.onload在加载图像和其他外部内容之前将其触发。文件。在window.onload之前触发onload事件。window......
  • JAVA-Random猜数字游戏
    packagecom.itheima;importjava.util.Random;importjava.util.Scanner;publicclassScanner04{publicstaticvoidmain(String[]args){//使用......
  • JAVA-Random随机整数
    packagecom.itheima;importjava.util.Random;/*Random的基本使用*/publicclassScanner03{publicstaticvoidmain(String[]args){//Random......
  • HTML DOM
    HTMLDOM是HTMLDocumentObjectModel(文档对象模型)的缩写,定义了访问和操作HTML文档的标准方法DOM以树结构表达HTML文档 HTMLDOM是:HTML的标准对象模型HTM......
  • JavaScriptDOM操作的性能优化
    浏览器的重排和重绘是比较消耗性能的操作,所以网页性能优化的手段就是减少重排和重绘的操作。比如:多次更改样式的操作合并为一次操作我们在JavaScript中修改样式,比如:constch......
  • DOM第二章 节点操作
    元素节点操作切换图片<style>p{text-align:center;width:400px;height:50px;}div{......
  • DOM第四章tab切换和自定义属性节点操作
    tab切换和自定义属性京东tab栏切换<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge">......
  • 解决element-ui的textarea组件的宽度无法修改的问题
    1参考来自http://www.iis7.com/a/nr/wz/202108/53923.html2示例需要先找到改组件的样式然后进行修改http://www.iis7.com/a/nr/wz/202108/53923.html .textarea>>......