HTML、DOM和JS的了解
1、HTML、JS、以及DOM的关系的关系说明
关于HTML、JS、以及DOM的关系一直很迷惑,虽然一直听人说,但并未理解。
偶然间,忽然懂了这三者之间的关系。
举例吧:
- HTML就是最终的页面,是一个静态的页面。是什么就是什么,没有外界操作就不会有改变;
- 如果要修改HTML的内容呢?这时就需要使用JS语言了,使用JS对HTML进行处理,调用对应函数即可;
- 但是JS如何处理的呢?JS函数内部又是如何处理的呢?这就需要DOM了。DOM 定义了访问和操作 HTML 文档的标准方法。
相当于DOM是一个底层API;JS通过对底层API进行封装,提供了简单的操作方法;我们用JS最多,但如果不用JS,其他语言同样可以通过DOM操作HTML。这就是三者之间的关系了。
2、对于DOM中结点的理解
根据 W3C 的 HTML DOM 标准,HTML 文档中的所有内容都是节点:
- 整个文档是一个文档节点
- 每个 HTML 元素是元素节点
- HTML 元素内的文本是文本节点
- 每个 HTML 属性是属性节点
- 注释是注释节点
这里要注意:
- 文档节点只有一个,就是文档本身。
- HTML元素:这个包含那些呢?参考链接即可,特别全。HTML 元素参考 - HTML(超文本标记语言) | MDN
- 属性结点:HTML 属性是属性节点。但HTML属性有哪些呢?HTML 属性参考 - HTML(超文本标记语言) | MDN
- 文本节点:文本节点很好理解。我们一般在元素内直接写的文字就是文本节点(虽然一般意识不到,不过在DOM中是这么处理的)。