DOM常用的四大对象是什么?
DOM常用的四大对象是什么?
一、总结
一句话总结:
1、关注结构,关注主干
2、从主干处着手的话,可以发现dom就是四个东西,document(文档),element,attribute,event(事件)。
1、在 HTML DOM (文档对象模型)中,是否是每个部分都是节点?
解答:是
2、所有 HTML 属性都是是属性节点么?
解答:是
3、HTML的文档本身是什么节点?
解答:文档节点
4、HTML的注释是什么节点:
解答:注释节点
5、HTML文档怎么变成Document 对象?
解答:载入浏览器。每个载入浏览器的 HTML 文档都会成为 Document 对象。
6、Document对象的主要作用是什么?
解答:Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
7、Element 对象可以拥有哪些子节点?
解答:Element 对象可以拥有类型为元素节点、文本节点、注释节点、属性节点的子节点。
8、HTML中的NodeList 对象是什么?
解答:NodeList 对象表示节点列表,比如 HTML 元素的子节点集合。
9、在 HTML DOM 中,Attr 对象表示 HTML 属性。 这句话对么?
解答:对
10、HTML 属性始终属于 HTML 元素。这句话对么?
解答:对
11、HTML中的NamedNodeMap 对象是什么?
解答:在 HTML DOM 中,NamedNodeMap 对象表示元素属性节点的无序集合。NamedNodeMap 中的节点可通过名称或索引(数字)来访问。
12、事件和函数的关系是什么?
解答:事件通常与函数结合使用,函数不会在事件发生前被执行!
二、简介
0、dom对象
HTML DOM 节点
在 HTML DOM (文档对象模型)中,每个部分都是节点:
- 文档本身是文档节点
- 所有 HTML 元素是元素节点
- 所有 HTML 属性是属性节点
- HTML 元素内的文本是文本节点
- 注释是注释节点
1、document对象
Document 对象
每个载入浏览器的 HTML 文档都会成为 Document 对象。
Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
提示:Document 对象是 Window 对象的一部分,可通过 window.document 属性对其进行访问。
2、element对象
Element 对象
在 HTML DOM 中,Element 对象表示 HTML 元素。
Element 对象可以拥有类型为元素节点、文本节点、注释节点的子节点。
NodeList 对象表示节点列表,比如 HTML 元素的子节点集合。
元素也可以拥有属性。属性是属性节点(参见下一节)。
3、attribute对象
Attr 对象
在 HTML DOM 中,Attr 对象表示 HTML 属性。
HTML 属性始终属于 HTML 元素。
NamedNodeMap 对象
在 HTML DOM 中,NamedNodeMap 对象表示元素属性节点的无序集合。
NamedNodeMap 中的节点可通过名称或索引(数字)来访问。
4、event对象
Event 对象
Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件通常与函数结合使用,函数不会在事件发生前被执行!
三、测试题-简答题
1、在 HTML DOM (文档对象模型)中,是否是每个部分都是节点?
解答:是
2、所有 HTML 属性都是是属性节点么?
解答:是
3、HTML的文档本身是什么节点?
解答:文档节点
4、HTML的注释是什么节点:
解答:注释节点
5、HTML文档怎么变成Document 对象?
解答:载入浏览器。每个载入浏览器的 HTML 文档都会成为 Document 对象。
6、Document对象的主要作用是什么?
解答:Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
7、Element 对象可以拥有哪些子节点?
解答:Element 对象可以拥有类型为元素节点、文本节点、注释节点、属性节点的子节点。
8、HTML中的NodeList 对象是什么?
解答:NodeList 对象表示节点列表,比如 HTML 元素的子节点集合。
9、在 HTML DOM 中,Attr 对象表示 HTML 属性。 这句话对么?
解答:对
10、HTML 属性始终属于 HTML 元素。这句话对么?
解答:对
11、HTML中的NamedNodeMap 对象是什么?
解答:在 HTML DOM 中,NamedNodeMap 对象表示元素属性节点的无序集合。NamedNodeMap 中的节点可通过名称或索引(数字)来访问。
12、事件和函数的关系是什么?
解答:事件通常与函数结合使用,函数不会在事件发生前被执行!
DOM常用的四大对象是什么?的更多相关文章
- 【repost】Javascript操作DOM常用API总结
Javascript操作DOM常用API总结 文本整理了javascript操作DOM的一些常用的api,根据其作用整理成为创建,修改,查询等多种类型的api,主要用于复习基础知识,加深对原生js的认 ...
- SVG DOM常用属性和方法介绍(1)
12.2 SVG DOM常用属性和方法介绍 将以Adobe SVG Viewer提供的属性和方法为准,因为不同解析器对JavaScript以及相关的属性和方法支持的程度不同,有些方法和属性是某个解析 ...
- DOM创建和删除节点、HTML DOM常用对象[转]
创建和删除节点:——核心DOM 1. 创建单个元素节点:3步: 1. 创建空元素节点对象: var elem=document.createElement("标 ...
- JS操作DOM常用API总结
<JS高程>中的DOM部分写的有些繁琐,还没勇气整理,直到看到了这篇博文 Javascript操作DOM常用API总结,顿时有了一种居高临下,一览全局的感觉.不过有时间还是得自己把书里面的 ...
- [js高手之路] dom常用API【appendChild,insertBefore,removeChild,replaceChild,cloneNode】详解与应用
本文主要讲解DOM常用的CURD操作,appendChild(往后追加节点),insertBefore(往前追加节点),removeChild(移除节点),replaceChild(替换节点),clo ...
- DOM常用的属性和方法
之前一直傻傻分不清DOM和JavaScript究竟有什么区别,随着相关工作时间的增长,开始逐渐区分DOM和JavaScript了,最近,也一直在复习有关DOM方面的知识,<JavaScript ...
- 添加/删除-HTML DOM 常用对象 -BOM-打开和关闭窗口- history-location
1. 添加/删除 3步: 1. 添加一个空元素 var a=document.createElement("a"); <a></a> 2. 定义元素的关键属 ...
- Javascript操作DOM常用API总结
基本概念 在讲解操作DOM的api之前,首先我们来复习一下一些基本概念,这些概念是掌握api的关键,必须理解它们. Node类型 DOM1级定义了一个Node接口,该接口由DOM中所有节点类型实现.这 ...
- JavaScript 操作 DOM 常用 API 总结
文本整理了javascript操作DOM的一些常用的api,根据其作用整理成为创建,修改,查询等多种类型的api,主要用于复习基础知识,加深对原生js的认识. 基本概念 在讲解操作DOM的api之前, ...
随机推荐
- Mysql 5.7.17 解压版(ZIP版)安装步骤详解
下载 解压版下载地址(需要登录) :http://dev.mysql.com/downloads/mysql/ 下载后解压到你想要安装的目录就可以了 配置环境变量 为了方便使用,不必每次都进入bin目 ...
- [Javascript AST] 0. Introduction: Write a simple BabelJS plugin
To write a simple Babel plugin, we can use http://astexplorer.net/ to help us. The plugin we want to ...
- 【MongoDB】The connection between two tables
In mongoDB, there are two general way to connect with two tables. Manual Connection and use DBRef 1. ...
- 循环体(for/while)循环变量的设置
1. 求滑动(移动)平均(moving average) double partialSum = 0; for (int i = 0; i < M-1; ++i) partialSum += A ...
- select下拉列表选中后,跳转新链接
1.在当前页面打开新链接 <select onchange="location.href=this.options[this.selectedIndex].value" na ...
- vue.js的基础与语法
Vue的实例 创建第一个实例: {{}} 被称之为插值表达式.可以用来进行文本插值. <!DOCTYPE html> <html lang="en"> &l ...
- [Angular] Omit relative path by set up in tsconfig.json
For example, inside you component you want to import a file from two up directory: import store from ...
- TCP的可靠传输机制(简单好理解:分段与流,滑窗,连接,流量控制,重新发送,堵塞控制)
TCP的几大模块:分段与流,滑窗,连接,流量控制,重新发送,堵塞控制. 1.checksum:在发送TCP报文的时候,里面的信息可能会因为环境的问题,发送变化,这时,接收信号的时候就需要通过check ...
- 百度ueditor vue项目应用 -- 图片上传源码修改
本文目的有两个,一.废掉单图上传,二.改造多图上传 大家都知道百度ueditor不是针对vue项目开发的,官方文档提供的源码包里有需要后端配置的接口,but到vue项目就不太好办了,网上有些文章也介绍 ...
- 基于element ui的图片预览插件
写插件很简单,满足两个条件即可,一.基本的逻辑思路,二.熟悉插件语法要求.本次Vue插件也比较简单,点击“查看图片”用轮播的方式限制用户上传的图片,如图: 项目采用的是vue-element-admi ...