JavaScript--认识DOM
文档对象模型DOM（Document Object Model）定义访问和处理HTML文档的标准方法。DOM 将HTML文档呈现为带有元素、属性和文本的树结构（节点树）。
先来看看下面代码:
将HTML代码分解为DOM节点层次图:
HTML文档可以说由节点构成的集合，三种常见的DOM节点:
1. 元素节点：上图中<html>、<body>、<p>等都是元素节点，即标签。
2. 文本节点:向用户展示的内容，如<li>...</li>中的JavaScript、DOM、CSS等文本。
3. 属性节点:元素属性，如<a>标签的链接属性href="http://www.imooc.com"。
看下面代码:
<a href="http://www.imooc.com">JavaScript DOM</a>
HTML文档可以说由节点构成的集合，DOM节点有:
1. 元素节点：上图中<html>、<body>、<p>等都是元素节点，即标签。
2. 文本节点:向用户展示的内容，如<li>...</li>中的JavaScript、DOM、CSS等文本。
3. 属性节点:元素属性，如<a>标签的链接属性href="http://www.imooc.com"。
节点属性:
遍历节点树:
以上图ul为例，它的父级节点body,它的子节点3个li,它的兄弟结点h2、P。
DOM操作:
注意:前两个是document方法。
JavaScript--认识DOM的更多相关文章
- javascript --- javascript与DOM
javascript与DOM: 我们来个例子,一个HTML里包含一段文本和一个无序的列表. <p id="intro">My first paragraph...< ...
- JavaScript与DOM
文档对象模型Document Object Model DOM(Document Object Model,文档对象模型)是一个通过和JavaScript进行内容交互的API.Javascript和D ...
- Javascript中DOM技术的的简单学习
第十四课DOM技术概述1:DOM概述 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节 ...
- JavaScript与DOM的关系
JavaScript与浏览器的工作 1.浏览器获取并加载你的页面,从上至下解析它的内容. 遇到JavaScript时,浏览器会解析代码,检查它的正确性,然后执行代码. 浏览器还会建立一个HTML页面的 ...
- JavaScript网站设计实践（四）编写about.html页面，利用JavaScript和DOM，选择性的显示和隐藏DIV元素
一.现在我们在网站设计(三)的基础上,来编写about.html页面. 这个页面要用到的知识点是利用JavaScript和DOM实现选择性地显示和隐藏某些DIV about.html页面在前面我们为了 ...
- JavaScript学习笔记(2)——JavaScript和DOM的关系
文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口.DOM实际上是以面向对象方式描述的文档模型.DOM定义了表示和修改文档所需的 ...
- JavaScript HTML DOM 元素(节点)
JavaScript HTML DOM 元素(节点) 创建新的 HTML 元素 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素 ...
- JavaScript HTML DOM EventListener
JavaScript HTML DOM EventListener addEventListener() 方法 实例 点用户点击按钮时触发监听事件: document.getElementById(& ...
- JavaScript HTML DOM 事件
JavaScript HTML DOM 事件 HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应. 实例 Mouse Over Me 对事件做出反应 我们可以在事件发生时执行 ...
- JavaScript HTML DOM - 改变CSS
JavaScript HTML DOM - 改变CSS HTML DOM 允许 JavaScript 改变 HTML 元素的样式. 改变 HTML 样式 如需改变 HTML 元素的样式,请使用这个语法 ...
随机推荐
- ubuntu tomcat自启动
1 编写启动文件/etc/init.d/tomcat7 文件内容如下:
- 洛谷 4251 [SCOI2015]小凸玩矩阵
[题解] 二分答案+二分图匹配. 先二分最小值Min,然后扫一遍这个矩阵,把满足a[i][j]<=Min的i,j连边,之后跑二分图匹配,如果最大匹配数大于等于n-k+1,当前的Min即是合法的. ...
- Spring核心技术（五）——Spring中Bean的作用域
前文概述了Spring的容器,Bean,以及依赖的一些信息,本文将描述一下Bean的作用域 Bean的作用域 当开发者定义Bean的时候,同时也会定义了该如何创建Bean实例.这些具体创建的过程是很重 ...
- java8 lambda 函数式编程
package com.atguigu.java8; import java.util.ArrayList; import java.util.Comparator; import java.util ...
- Windows学习总结（9）——Windows系统常用的网络控制指令
ping 命令式用来测试TCP/IP 网络是否畅通或者网络连接速度的命 令,其原理是根据计算机唯一标示的IP 地址,当用户给目的地址发 送一个数据包时,对方就会返回一个同样大小的数据包,根据返回的 数 ...
- ViewService
ViewService 在分布式系统中,最常见的场景就是主备架构.但是如果主机不幸宕机,如何正确的通知客户端当前后端服务器的状况成为一个值得研究的问题.本文描述了一种简单的模型用于解决此问题. 背景 ...
- 实例：Mongodb集群配置过程
最近因为一些项目公司开始采用Mongodb做为大量的数据存储,通过网络上大量的资源自己已经掌握一套可行的Mongodb集群配置过程,Mongodb具有无规则存储.大数据存储.多平台支持.强大的扩展插件 ...
- 设置Linux使用SMTP服务发送邮件
很多时候我们需要知道服务器的运行状态,比如发生了异常的报警.数据库备份的状态等,假如服务器自动跟你汇报那就好了,我们可以通过设置当触发某些条件时让服务器发送邮件给你,这样你就可以了解你的服务器的状态怎 ...
- 母函数（Generating function）详解
母函数(Generating function)详解 在数学中,某个序列的母函数(Generating function,又称生成函数)是一种形式幂级数,其每一项的系数可以提供关于这个序列的信息.使用 ...
- Memcached的Web管理工具MemAdmin（待实践）
Memcached的Web管理工具有很多,但是最好用的应该是MemAdmin.基于PHP5开发,所以部署时要注意环境. 介绍:http://www.junopen.com/memadmin/ 下载:h ...