根据 W3C 的 HTML DOM 标准,HTML 文档中的所有内容都是节点:

  • 整个文档是一个文档节点
  • 每个 HTML 元素是元素节点
  • HTML 元素内的文本是文本节点
  • 每个 HTML 属性是属性节点
  • 注释是注释节点

节点父、子和同胞

节点树中的节点彼此拥有层级关系。

父(parent)、子(child)和同胞(sibling)等术语用于描述这些关系。父节点拥有子节点。同级的子节点被称为同胞(兄弟或姐妹)。

  • 在节点树中,顶端节点被称为根(root)
  • 每个节点都有父节点、除了根(它没有父节点)
  • 一个节点可拥有任意数量的子
  • 同胞是拥有相同父节点的节点

获取某个元素下的第一个节点:firstElementChild
获取某个元素下的最后一个节点:lastElementChild

parentNode:查找某个元素的父节点。

找到某个元素的下个兄弟节点:nextElementSibling
找到某个元素的上个兄弟节点:previousElementSibling

HTML DOM querySelector() 方法

querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。

注意: querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素,请使用 querySelectorAll() 方法替代。

DOM追加笔记的更多相关文章

  1. javascript dom追加内容的例子

    javascript dom追加内容的使用还是比较广泛的,在本文将为大家介绍下具体的使用方法. 例子: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

  2. DOM&BOM笔记

    day01正课:1. DOM概述2. ***DOM树3. *查找 1. DOM概述: DHTML:动态网页技术的统称 DHTML=HTML+CSS+JS 鄙视题: HTML XHTML DHTML X ...

  3. DOM学习笔记--入门1

    HTML DOM 是关于如何获取.修改.添加或删除 HTML 元素的标准. 首先节点有很多种,不仅仅HTML元素是节点,尤其 要注意文本节点的存在. 根据 W3C 的 HTML DOM 标准,HTML ...

  4. HTML DOM 学习笔记

    一.HTML DOM定义了所有HTML元素的对象和属性,以及访问他们的方法即:HTML DOM是关于如何获取,修改,添加,删除HTML元素的标准二.DOM节点1.分类整个文档是一个文档节点每个HTML ...

  5. 【javascript dom读书笔记】 第九章 CSS-DOM

    用dom设置样式 element.style.property = value 何时用dom脚本设置样式 作者写到:绝大多数的现代浏览器,虽然对css伪类的支持不是很完整,但是对dom都有良好的支持, ...

  6. Dom学习笔记

    今天老师出了一道面试题目:取到表单里面的textbox的值,两种方法.知道一种,老师说的什么dom,我竟然不知道. 以前学html的时候,老师也重来没有提到dom的概念.javaScript只是学了一 ...

  7. JS DOM学习笔记

    1.window对象代表当前浏览器窗口 2.使用window对象的属性.方法的时候可以省略window.例如:window.alert("hello")一般写成alert(&quo ...

  8. Dom学习笔记-(一)

    一.概述 DOM(文档对象模型)是针对HTML和XML文档的一个API,其脱胎于DHTML. DOM可以将任意HTML和XML文档描绘成一个由多层节点构成的结构. 每一个文档包含一个根节点-文档节点, ...

  9. BOM、DOM学习笔记——JavaScript

    1.BOM的概述    browser object modal :浏览器对象模型.    浏览器对象:window对象.    Window 对象会在 <body> 或 <fram ...

随机推荐

  1. go语言学习--处理map的无序输出

    最近工作中遇到了这样的一个场景,需要处理一个无限极分类的问题,对于数据结构的定义首先想到了,map,map[int]map[int]struct.通过两层map的定义归类parent_id和id的关系 ...

  2. 经典算法二分查找循环实现Java版

    二分查找 定义 二分查找(Binary Search)又称折半查找,它是一种效率较高的查找方法. 要求 (1)必须采用顺序存储结构 (2)必须按关键字大小有序排列 查找思路 首先将给定值K,与表中中间 ...

  3. FileProvider相关 Failed to find configured root that contains

    问题: 使用FileProvider构造SD卡中文件uri时异常 java.lang.IllegalArgumentException: Failed to find configured root ...

  4. LSTM/RNN中的Attention机制

    一.解决的问题 采用传统编码器-解码器结构的LSTM/RNN模型存在一个问题,不论输入长短都将其编码成一个固定长度的向量表示,这使模型对于长输入序列的学习效果很差(解码效果很差). 注意下图中,ax ...

  5. 基于form表单 写登陆注册

    urls urlpatterns = [ url(r'^admin/', admin.site.urls), # 登录界面url(r'^login/$', views.login,name='logi ...

  6. android 开发 更好的数据存放,回调,处理class模式,适合与各种布局适配器class一起使用

    预先导入数据模式: /** * Created by lenovo on 2018/5/18. */ public class DeivceListData { private DeivceListD ...

  7. JavaScript获取、修改CSS样式合辑

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 学习C++,应该循序渐进的看哪些书?

    在某博客上看到的一个C++书籍阅读清单,可以参考下: 阶段 1<Essential C++>这是一本内容不多但很实用的C++入门书籍,强调快速上手与理解C++编程.本书主要围绕一系列逐渐复 ...

  9. zookeeper 集群部署

    参考: https://www.cnblogs.com/linuxprobe/p/5851699.html

  10. test case VS test scenario

    ---恢复内容开始--- 1. test case: how to test --如何测试 test scenario: what to  be tested  --测试什么 2. test scen ...