DOM不同的结点类型】的更多相关文章

1)node类型 nodeName(what node) and nodeValue(always null) node父子之间可以用childNodes来表示 firstChild,childNodes[a],lastChild 兄弟结点,可以用nextsiBiling,previousSibling 在什么点前面插入地加  a.insertBefore(c,b); node的替换a.replaceChild(c,b); node的移除a.remove(b) 克隆cloneNode(),里面有…
jQuery DOM操作之结点转移复制 $('div').append($('p'))这样即可把p标签移动到div标签里 $('div').append( $('p').html() )是把p标签里的内容复制到div标签里 $('div').append( $('p').clone(true))是复制一份到div标签里,原来的标签还保留着 $(function(){  $(".nm_ul li").click(function(){ //当clone参数设置为true时还可以将按钮上绑…
前言: 本系列从原型,原型链,属性类型等方面下手学习了DOM文档对象模型,旨在弄清我们在DOM中常用的每一个属性和方法都清楚它从哪里来要到哪里做什么事,这样对于理解代码有一定启发.全靠自己在总结中摸索,所以对于一个问题要是深究还真能挖出许多有意思的东西,现在觉得JavaScript这个东西简直越来越有意思了. 正文:DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口).DOM描绘了一个层次化的节点树,允许开发人员添加,移除,修改页面某一部分,现在它已成为表现和操作页面…
JS中迭代元素特性 在需要将DOM结构序列化为XML或者HTML字符串时,多数都会涉及遍历元素的特性,这个时候attributes属性就可以派上用场. 以下代码展示了如何迭代元素的每一个特性,然后将他们构造成 name = "value"  name = "value" 这样的字符串格式. function outputAttributes(element) { var pairs = new Array(); for(var i=0, len=element.at…
DOM(Document Object Model)是针对HTML和XML文档的一个API.DOM描述的是一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.起源于DHML,现为W3C的推荐标准. IE中的所有DOM对象都是以COM对象的形式实现. 节点层次 DOM可以将任何HTML或XML文档描绘成一个有多层节点构成的结构.节点分为几种不同的类型,每种类型分别表示文档中的不同信息及标记.每个节点都有各自的属性,数据和方法,同时也与其他节点存在联系.所有页面标记表现为以一个特定节点为…
文本节点由Text类型表示,包含的是可以按照字面解释的纯文本内容,纯文本中可以包含转义后的HTML字符但不能包含HTML代码.原型链继承关系为:textNode.__proto__->Text.prototype->CharacterData.prototype->Node.prototype->EventTarget.prototype->Object.prototype.Text节点具有以下特征 nodeType值为3 nodeName值为"#text"…
Element类型用于表现XML或HTML元素,提供对元素标签名,子节点及特性的访问.原型链的继承关系为 某节点元素.__proto__->(HTML某元素Element.prototype)->HTMLElement.prototype->Element.prototype->Node.prototype->EventTarget.prototype.以HTML元素为例:document.documentElement.__proto__->HTMLHtmlEleme…
JavaScript通过Document类型表示文档,原型链的继承关系为:document.__proto__->HTMLDocument.prototype->Document.prototype->Node.prototype->EventTarget.prototype Document节点具有下列特征:以下属性均为Node.prototype上的 nodeType值为9 nodeName值为"#document" nodeValue值为null pare…
Document 类型 JavaScript 通过 Document 类型表示文档.在浏览器中, document 对象是 HTMLDocument (继承自 Document 类型)的一个实例,表示整个 HTML 页面.而且, document 对象是 window 对象的一个属性,因此可以将其作为全局对象来访问. Document 类型可以表示 HTML 页面或者其他基于 XML 的文档.不过,最常见的应用还是作为HTMLDocument 实例的 document 对象.通过这个文档对象,不…
Element 类型用于表现 XML或 HTML元素,提供了对元素标签名.子节点及特性的访问. 要访问元素的标签名,可以使用 nodeName 属性,也可以使用 tagName 属性:这两个属性会返回相同的值.如下所示: <div id="myDiv"></div> var div = document.getElementById("myDiv"); alert(div.tagName); //"DIV" alert(d…
以下的例子以此HTML文档结构为例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="demo"> <ul id="contents">…
文本节点 标签之间只要有一点内容都会有文本节点,包括空格 创建文本节点document.createTextNode() 可以使用 document.createTextNode 创建新文本节点 ==一般情况下,每个元素只有一个文本节点== ==但是在某些情况下也会有多个节点,例子如下== //创建父节点 var element=document.createElement("div"); element.className="message"; //添加第一个文本…
一.遍历API(2个) 1.深度优先原则遍历NodeIterator 节点迭代器 创建遍历API对象: var iterator=document.createNodeIterator(开始的父节点对象,whatToShow,null,false); whatToShow: NodeFilter.SHOW_ELEMENT(遍历元素节点) NodeFilter.SHOW_ALL(遍历所有) 用while循环,反复调用iterator.nextNode()方法 只要nextNode(),就向下一个移…
有俩种方式操作结点的属性. 首先我们需要先获取所要操作的结点元素: var uname=document.getElementById("uname"); var gan=uname.getAttribute("value"); var gat=uname.getAttribute("type"); 俩种方法获取结点元素,根据获取的结点元素,在去操作元素的属性. //操作属性的方式一 uname.type="button";…
一.什么是DOM?    什么叫DOM,DOM是文档对象模型(Document Object Model,是基于浏览器编程(在本教程中,可以说就是DHTML编程)的一套API接口,W3C出台的推荐标准,每个浏览器都有一些细微的差别,其中以Mozilla的浏览器最与标准接近.单纯的Javascript要结合DOM才能做DHTML编程,才能做出漂亮的效果.应用于WEB.这点几乎与其它的语言无异,正如C/C++需要库支持是一样的道理.否则就是单纯的在语法上做研究了.    因此,必须要对DOM有一定的…
在文档对象模型中,每个结点都是一个对象.DOM结点有三个重要的属性:nodeName .nodeValue和nodeType,分别表示结点名称.结点的值和结点的类型 一.nodeName,结点名称,只读1. 元素节点的 nodeName 是标签名2. 属性节点的 nodeName 是属性名3. 文本节点的 nodeName 永远是 #text4. 文档节点的 nodeName 永远是 #document 二.nodeValue,结点的值1. 元素节点的 nodeValue 是 undefined…
× 目录 [1]特征 [2]属性 [3]方法 前面的话 元素的特性在DOM中以Attr类型表示,从技术角度讲,特性是存在于元素的attributes属性中的节点.尽管特性是节点,但却不是DOM节点树的一部分.本文将详细介绍该部分内容 特征 特性节点的三个node属性————nodeType.nodeName.nodeValue分别是2.特性名称和特性值,其父节点parentNode是null [注意]关于特性节点是否存在子节点,各个浏览器表现不一致 <div id="box"&g…
这次总结的是剩下的这些DOM类型节点,可能你见过却不经常使用但是了解一下总是好的,可以加深对DOM体系的整体理解~.本篇要介绍的是Comment,CDATASection,DocumentType,DocumentFragment,Attr类型. Comment类型 原型链继承关系为comment实例.__proto__->Comment.prototype->CharacterData.prototype->Node.prototype->EventTarget.prototyp…
一.Text类型 文本节点由Text类型表示,指的是可以以字面意思解释的纯文本内容,其中包含HTML代码. nodeType=3 nodeName=#text nodeValue=文本内容 parentNode是一个Element nodeValue属性和data属性作用一致,都可以访问文本节点的内容 操作文本节点的内容: appendData(text);//将text添加到节点的末尾 deleteData(Offset,count);//从Offset位置开始删除count个字符 inser…
DOM1定义了一个node接口,该接口由DOM的所有节点类型实现. 所有的节点都存在这样或那样的关系.在HTML中,head,body可以看出是html的子元素,html是head,body的父元素,而head,body互为同胞元素. 这里要注意一个概念:nodeList 输出: 如下例子: <div id="myDiv"> </div><!-- 此处有空格 --> <script> var div = document.getEleme…
节点属性 在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType :节点的类型 一.nodeName 属性: 节点的名称,是只读的. 1. 元素节点的 nodeName 与标签名相同2. 属性节点的 nodeName 是属性的名称3. 文本节点的 nodeName 永远是 #text4. 文档节点的 nodeName 永远是 #document 二.nodeVal…
DOM Scripting - Web Design with JavaScript and the Document Object Model,Jeremy Keith中文名:JavaScript DOM 编程艺术 用了一周的时间看完了这本书,其实内容还是很简单的,顺便用来学习英语,积累了一些单词.读完一本书不容易,总要做些记录,才够本儿. DOM,文档对象模型,D表示文档,web页面:D表示对象,document对象:M表示模型,浏览器提供的一种web页面的映射(模型),你可用JavaScr…
DOM(文档对象模型)简介 DOM(文档对象模型)针对HTML和XML文档的一个API. DOM可以将任何HTML或XML文档描绘成由多层节点构成的树形结构,它是中立于平台和语言的接口,允许程序和脚本动态地访问和更新文档的内容.结构和样式. Javascript通常都是用来进行DOM操作和交互的.当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model). 以下讨论的是HTML DOM. 每一个网页元素(一个HTML标签)被看做一个对象.文档对象模型通常被理解成…
1.认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码: 将HTML代码分解为DOM节点层次图:…
一.什么是DOM DOM全称是document object model(文档对象模型).在网页上,组织页面(或文档)的对象被组织在一个树形结构中,用来表示文档中对象的标准模型就称为DOM.通俗的说DOM其实就是针对HTML和XML文档的一个API接口,用于操作HTML/XML. W3C DOM 标准被分为 3 个不同的部分: 核心 DOM - 针对任何结构化文档的标准模型 XML DOM - 针对 XML 文档的标准模型 HTML DOM - 针对 HTML 文档的标准模型 二.DOM节点 注…
一.浏览器对象 1. window对象 window对象是BOM的核心,window对象指当前的浏览器窗口. window对象方法: 注意:在JavaScript基础篇中,已讲解了部分属性,window对象重点讲解计时器. 代码示例: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"…
/*DOM解析编程 •遍历所有节点 •查找某一个节点 •删除结点 •更新结点 •添加节点 /* package cn.itcast.jaxp; import java.io.File; import java.io.IOException; import javax.xml.parsers.DocumentBuilder; import javax.xml.parsers.DocumentBuilderFactory; import javax.xml.parsers.ParserConfigu…
节点属性 在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType :节点的类型 一.nodeName 属性: 节点的名称,是只读的. 1. 元素节点的 nodeName 与标签名相同2. 属性节点的 nodeName 是属性的名称3. 文本节点的 nodeName 永远是 #text4. 文档节点的 nodeName 永远是 #document 二.nodeVal…
一 . 节点属性 DOM 是树型结构,相应的,可以通过一些节点属性来遍历节点树: 方法 说明 nodeName 节点名称,相当于tagName.属性节点返回属性名,文本节点返回#text.nodeName,是只读的. nodeType 节点的类型,返回值:1,元素节点:2,属性节点:3,文本节点.nodeType 是只读的. nodeValue 节点的值,返回一个字符串,指示这个节点的值.元素节点返回 null,属性节点返回属性值,文本节点返回文本.nodeValue 可读可写,这是对元素节点不…