DOM基础教程之模型中的模型节点

<html>位于网页的顶端

它没有父辈,称之为根节点

1.元素节点(element node)

可以说,整个DOM模型都是由元素节点(element node)组成

比如文本段落元素“<p>”,无序清单的名称“<ul>”,元素节点包含其他元素、

2.文本节点(text node)

例如<h2>中的文本“标题1”,<li>中的文字内容,这些具体文本在DOM称为(text node)

3.属性节点(attribute node)

作为页面中的元素,或多或少会有一些属性,例如几乎所有元素都有title属性。由于属性都是放在标签里,因此,属性节点总是包含在元素节点内

小伙伴们是否对DOM的模型节点理解深刻了一点呢,希望大家喜欢。

(0)

相关推荐

  • 文档对象模型DOM通俗讲解

    在开始之前先说一点,DOM是非常容易理解的,但是大家说的太官方,让人很是难于理解,我们就用非常简单的语言翻译一遍.加深对DOM的理解,从而对它有一个全面的认识. 什么是DOM DOM的全称是Document Object Model,即文档对象模型,它允许脚本控制Web页面.窗口和文档. 如果没有DOM,JavaScript将是另外一种脚本语言:而有了DOM,它将成为制作动态页面的强有力工具.DOM不是JavaScript语言的一部分,而是内置在浏览器中的一个应用程序接口.当然,我们可以简单的理

  • 关于javascript DOM事件模型的两件事

    事件捕捉(Event Capture)的实现问题 W3C DOM Level2的事件模型规范中,事件在DOM树中的传播过程(从根节点到目标节点)被分为了两个阶段:捕捉(Capture)和冒泡(Bubbling).下面这个图能大概的说明整个过程: (from W3C) 如果想创建一个捕捉事件,在支持W3C 事件模型的浏览器中,将addEventListener的第三个参数设为true就好了.例如: 复制代码 代码如下: document.getElementById('foo').addEvent

  • 什么是DOM(Document Object Model)文档对象模型

    D:document 文档 浏览器加载的页面 DOM O:object 对象 页面及页面中的任何元素都是对象 M:module 模型 页面中的元素的组织形式 DOM被W3C组织设计为一种平台无关.语言无关的API,程序或脚本通过其动态访问.修改文档的内容.样式.结构. DOM是web 浏览器的运行规范,javascript借助DOM成就了其web标准语言的地位,在web领域实现了所谓"一次编写到处运行"的目标. 文档对象模型(Document Object Model,DOM)是一种用

  • js DOM模型操作

    DOM模型中的节点:元素节点.文本节点.属性节点 例:<a href="http://www.cnblogs.com/shuz">私のdotnet小屋</a> (1)a是元素节点 (2)"私のdotnet小屋"是文本节点 (3)href="http://www.cnblogs.com/shuz"是属性节点 DOM节点的属性 属性 类型 说明 nodeName String 节点名称,根据节点的类型而定义 nodeValue

  • DOM基础教程之使用DOM

    在了解DOM(文本对象模型)的框架和节点后,最重要的是使用这些节点处理html网页 对于一个DOM节点node,都有一系列的属性和方法可以使用.常用的有下表. 完善:http://www.w3school.com.cn/xmldom/dom_element.asp 1.访问节点 BOM提供了一些边界的方法访问节点,常用的就是getElementsByTagName(),和getElementById() 复制代码 代码如下: <script type="text/javascript&qu

  • DOM基础教程之模型中的模型节点

    <html>位于网页的顶端 它没有父辈,称之为根节点 1.元素节点(element node) 可以说,整个DOM模型都是由元素节点(element node)组成 比如文本段落元素"<p>",无序清单的名称"<ul>",元素节点包含其他元素. 2.文本节点(text node) 例如<h2>中的文本"标题1",<li>中的文字内容,这些具体文本在DOM称为(text node) 3.属

  • DOM基础教程之使用DOM控制表格

    表格的css控制就先不说了,首先分享下表格常用的DOM 表格添加操作的方法常用的为insertRow()和insertCell()方法. row是从零开始计算起的,例如: 复制代码 代码如下: var oTr = document.getElementById("member").insertRow(2) 是指将新行添加到第二行. 复制代码 代码如下: var aText = new Array(); aText[0] = document.createTextNode("f

  • DOM基础教程之事件对象

    浏览器中的事件都是以对象的形式存在的,同样ie浏览器与标准dom浏览器之间存在获取事件对象上也存在差别.在ie浏览器中事件对象是windows对象的一个属性event,访问通常采用如下方法. 复制代码 代码如下: oP.onclick = function(){ var oEvent = window.event; } 尽管它是window对象属性,但event对象还是只能在事件发生时被访问,所有的事件处理函数执行完之后,该对象就消失了. 而标准的dom规定event对象必须作为唯一的参数传给事

  • DOM基础教程之事件类型

    对于用户事件类型而言,最常用的是鼠标.键盘.浏览器. 1.鼠标事件: 鼠标的事件都频繁使用,下面例子就测试各种鼠标事件 复制代码 代码如下: <script language="javascript">             function handle(oEvent) {                 var disp = document.getElementById("display");                 if (window

  • DOM基础教程之使用DOM控制表单

    1.表单简介 表单<form>是网页中交互最多的形式之一,它通过各种形式接收用户的数据,包括下拉列表框,单选按钮,复选框和文本框,本篇主要介绍表单中常用的属性和方法 javascript中可以很方便的操作表单,例如获得表单数据进行有效验证,自动给表单域赋值,处理表单事件等. 此时每个form都解析为一个对象,即form对象,可以通过document.forms集合来引用这些对象,例如一个nama属性为form1的表单可以使用 复制代码 代码如下: document.forms["fo

  • DOM基础教程之使用DOM设置文本框

    1.控制用户输入的字符个数 对于单行文本框和密码输入框,可以利用maxlength属性控制用户输入的字符个数. 对于多行文本,maxlength为自定义属性,其值最多输入的字符的个数,在onkeypress事件发生时则调运返回LessThan()函数返回值,函数如下 <textarea name="comments" id="comments" cols="40" rows="4" maxlength="50&

  • DOM基础教程之使用DOM + Css

    1.使用getElementsByTagName修改class类别或者追加类别 复制代码 代码如下: <ul class="name1" onclick="clickz()">     <p>第一个</p>     <p>第一个</p>     <p>第一个</p>     <p>第一个</p> </ul> <script type=&quo

  • python基础教程项目四之新闻聚合

    <python基础教程>书中的第四个练习,新闻聚合.现在很少见的一类应用,至少我从来没有用过,又叫做Usenet.这个程序的主要功能是用来从指定的来源(这里是Usenet新闻组)收集信息,然后讲这些信息保存到指定的目的文件中(这里使用了两种形式:纯文本和html文件).这个程序的用处有些类似于现在的博客订阅工具或者叫RSS订阅器. 先上代码,然后再来逐一分析: from nntplib import NNTP from time import strftime,time,localtime f

  • PHP的Yii框架中Model模型的学习教程

    模型是 MVC 模式中的一部分, 是代表业务数据.规则和逻辑的对象. 模型是 CModel 或其子类的实例.模型用于保持数据以及与其相关的业务逻辑. 模型是单独的数据对象.它可以是数据表中的一行,或者一个用户输入的表单. 数据对象的每个字段对应模型中的一个属性.每个属性有一个标签(label), 并且可以通过一系列规则进行验证. Yii 实现了两种类型的模型:表单模型和 Active Record.二者均继承于相同的基类 CModel. 表单模型是 CFormModel 的实例.表单模型用于保持

随机推荐