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中是这么处理的)。
3、结束
HTML、DOM和JS的了解的更多相关文章
- how to get iframe dom in js
how to get iframe dom in js https://stackoverflow.com/questions/3999101/get-iframes-document-from-ja ...
- HTML(.js) – 最简单的方式操作 DOM 的 JS 库
HTML(.js) 是一个轻量的(压缩后~2kb) JavaScript 库,简化了与 DOM 交互的方法. 这个 JavaScript 库的方法可读性很好,并具有搜索和遍历 DOM 的方法.相比 j ...
- 开发成功-cpu-mem监控动态折线图--dom esayui js java
jsp ------------------------------------------------------------------------------------------- ---- ...
- JS操作DOM对象——JS基础知识(四)
一.JavaScript的三个重要组成部分 (1)ECMAScript(欧洲计算机制造商协会) 制定JS的规范 (2)DOM(文档对象模型)重点学习对象 处理网页内容的方法和接口 (3)BOM(浏览器 ...
- JS中的函数、Bom、DOM及JS事件
本期博主给大家带来JS的函数.Bom.DOM操作,以及JS各种常用的数据类型的相关知识,同时,这也是JavaScript极其重要的部分,博主将详细介绍各种属性的用法和方法. 一.JS中的函数 [函数的 ...
- DOM 以及JS中的事件
[DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document. ...
- 从零开始的JS生活(二)——BOM、DOM与JS中的事件
上回书说道,JS中变量.运算符.分支结构.循环和嵌套循环等内容.本回就由本K给大伙唠唠JS中的BOM.DOM和事件. 一."花心大萝卜"--BOM 1.震惊,FFF团为何对BOM举 ...
- 从template到DOM(Vue.js源码角度看内部运行机制)
写在前面 这篇文章算是对最近写的一系列Vue.js源码的文章(https://github.com/answershuto/learnVue)的总结吧,在阅读源码的过程中也确实受益匪浅,希望自己的这些 ...
- [AaronYang原创] 大话ASP.NET MVC3+ (C#与DOM与JS页面上的很炫的技巧)
案例一:比如我要传递一个新闻标题和新闻内容 存储到数据库去 1.最简单的通用Url公式就是 function getUrl() { var d = $("#表单ID").seria ...
随机推荐
- js一点代码备用
加载次序 .1等页面加载完毕 <script type="text/javascript"> jQuery(window).load(function(){ ... } ...
- 180508 - 解决有关VIVO的2018-04-01安全补丁导致的APP闪退问题
解决有关VIVO的2018-04-01安全补丁导致的APP闪退问题 [√]问题原因猜测4: 最终解决方案 [√]问题原因猜测3: 尝试解决 [√成功] [×]问题原因猜测2: 尝试解决 [×失败] [ ...
- 使用SQLite
SQLite是一种嵌入式数据库,它的数据库就是一个文件.由于SQLite本身是C写的,而且体积很小,所以,经常被集成到各种应用程序中,甚至在iOS和Android的App中都可以集成. Python就 ...
- c++11 thread (目前我使用的ZThread库)
目前为止(2014-11-30),GCC其实已经基本上完全支持C++11的所有功能了,事实上从GCC4.7之后,就支持了-std=c++11选项,在4.7版本之前,也开始支持-std=c++0x的选项 ...
- hdu 1000&hdu1001
1001 #include<iostream> #include<stdio.h> using namespace std; int main() { long long n; ...
- invalid comparison: java.util.ArrayList and java.lang.String——bug解决办法
今天碰到个问题,解决了很久才搞定,来记录下,希望可以帮助到大家 贴错误源码: 这是一个根据list集合的查找数据的 sql,在接收list的时候加了判断 list != ‘ ’ “”,引起了集合与St ...
- R学习----数据类型
今天开始学习R语言了,没原因,就是想学 本人开发环境在ubuntu 16.04 LTS下 R命令提示符 终端直接输入R进入交互模式进行R学习.如下图 R脚本 # My first program in ...
- oracle 手动 备份 恢复
手工备份, 我只考虑全备, 即 control file, redo log file, datafile, password file, spfile(pfile), listener.ora, t ...
- Servlet Servlet是Java平台上的CGI技术
Servlet Servlet是Java平台上的CGI技术.Servlet在服务器端运行,动态地生成Web页面.与传统的CGI和许多其它类似CGI的技术相比,Java Servlet具有更高的效率并更 ...
- RedHat Ent 6.5 64bit编译安装hadoop2.4.1
RedHat Ent 6.5 64bit编译安装hadoop2.4.1 感谢原帖:http://blog.csdn.net/w13770269691/article/details/16883663/ ...
how to get iframe dom in js https://stackoverflow.com/questions/3999101/get-iframes-document-from-ja ...
HTML(.js) 是一个轻量的(压缩后~2kb) JavaScript 库,简化了与 DOM 交互的方法. 这个 JavaScript 库的方法可读性很好,并具有搜索和遍历 DOM 的方法.相比 j ...
jsp ------------------------------------------------------------------------------------------- ---- ...
一.JavaScript的三个重要组成部分 (1)ECMAScript(欧洲计算机制造商协会) 制定JS的规范 (2)DOM(文档对象模型)重点学习对象 处理网页内容的方法和接口 (3)BOM(浏览器 ...
本期博主给大家带来JS的函数.Bom.DOM操作,以及JS各种常用的数据类型的相关知识,同时,这也是JavaScript极其重要的部分,博主将详细介绍各种属性的用法和方法. 一.JS中的函数 [函数的 ...
[DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document. ...
上回书说道,JS中变量.运算符.分支结构.循环和嵌套循环等内容.本回就由本K给大伙唠唠JS中的BOM.DOM和事件. 一."花心大萝卜"--BOM 1.震惊,FFF团为何对BOM举 ...
写在前面 这篇文章算是对最近写的一系列Vue.js源码的文章(https://github.com/answershuto/learnVue)的总结吧,在阅读源码的过程中也确实受益匪浅,希望自己的这些 ...
案例一:比如我要传递一个新闻标题和新闻内容 存储到数据库去 1.最简单的通用Url公式就是 function getUrl() { var d = $("#表单ID").seria ...
加载次序 .1等页面加载完毕 <script type="text/javascript"> jQuery(window).load(function(){ ... } ...
解决有关VIVO的2018-04-01安全补丁导致的APP闪退问题 [√]问题原因猜测4: 最终解决方案 [√]问题原因猜测3: 尝试解决 [√成功] [×]问题原因猜测2: 尝试解决 [×失败] [ ...
SQLite是一种嵌入式数据库,它的数据库就是一个文件.由于SQLite本身是C写的,而且体积很小,所以,经常被集成到各种应用程序中,甚至在iOS和Android的App中都可以集成. Python就 ...
目前为止(2014-11-30),GCC其实已经基本上完全支持C++11的所有功能了,事实上从GCC4.7之后,就支持了-std=c++11选项,在4.7版本之前,也开始支持-std=c++0x的选项 ...
1001 #include<iostream> #include<stdio.h> using namespace std; int main() { long long n; ...
今天碰到个问题,解决了很久才搞定,来记录下,希望可以帮助到大家 贴错误源码: 这是一个根据list集合的查找数据的 sql,在接收list的时候加了判断 list != ‘ ’ “”,引起了集合与St ...
今天开始学习R语言了,没原因,就是想学 本人开发环境在ubuntu 16.04 LTS下 R命令提示符 终端直接输入R进入交互模式进行R学习.如下图 R脚本 # My first program in ...
手工备份, 我只考虑全备, 即 control file, redo log file, datafile, password file, spfile(pfile), listener.ora, t ...
Servlet Servlet是Java平台上的CGI技术.Servlet在服务器端运行,动态地生成Web页面.与传统的CGI和许多其它类似CGI的技术相比,Java Servlet具有更高的效率并更 ...
RedHat Ent 6.5 64bit编译安装hadoop2.4.1 感谢原帖:http://blog.csdn.net/w13770269691/article/details/16883663/ ...