一、Text类型

文本节点由Text类型表示,指的是可以以字面意思解释的纯文本内容,其中包含HTML代码。

nodeType=3

nodeName=#text

nodeValue=文本内容

parentNode是一个Element

nodeValue属性和data属性作用一致,都可以访问文本节点的内容

操作文本节点的内容:

appendData(text);//将text添加到节点的末尾

deleteData(Offset,count);//从Offset位置开始删除count个字符

insertData(Offset,text);//在Offset位置插入text

replaceData(Offset,count,text);//用text替换Offset起Offset+count终的字符

spiltText(offset);//在offset位置将文本分为两个文本节点

substringData(offset,count);//提取从offset到offset+count位置的字符串

每个包含文本的元素只能包含一个文本节点,并且文本节点必须有内容。空格也可以

1、创建文本节点

document.createTextNode();参数为插入节点中的文本。

在创建新的文本节点时,除非将文本节点插入到文档树已存在的节点中,否则不会在浏览器窗口看见新节点。

<script type="text/javascript">
var div=document.createElement("div");
div.className="message";
var text=document.createTextNode("new node");
div.appendChild(text);
alert(document.body.appendChild(div)); </script>

这段代码必须放在body中,不然document.body会为null。同时new node会出现在页面中

2、规范化文本节点

合并相邻文本节点的normalize()方法。在一个包含两个或多个文本节点的父元素上调用normalize()方法,会将所有同胞文本节点合并为1个文本节点,节点的nodeValue值为合并之后的值。

<script type="text/javascript">
var div=document.createElement("div");
div.className="message";
var text=document.createTextNode("new node");
var text1=document.createTextNode("new node1");
div.appendChild(text);
div.appendChild(text1);
alert(div.childNodes.length);//2
div.normalize();
alert(div.childNodes.length);//1
document.body.appendChild(div); </script>

二、Comment类型

注释在DOM中是Comment类型表示的。

nodeName=#comment

parentNode为Document或Element

和Text类型的操作方式相同

三、CDATASection类型

针对XML文档表示CDATA区域继承自Text用于除spiltText之外所有方法

nodeName=#cdata-section

在XML文档中可以使用document.createCDATASection(),方法创建

四、DocumentType类型(不常用)

五、Attr类型

元素的特性在DOM中是以Attr类型来表示的。在所有浏览器中都可以访问Attr类型的构造函数和属性。

parentNode=null;

3个属性:name=nodeName,value=nodeValue,specified

javascript之DOM(四其他类型)的更多相关文章

  1. javascript之DOM(三Element类型)

    Element类型用于表现XML和HTML的元素,提供了对元素标签名.子节点及特性的访问. 要访问标签名可以使用nodeName和tagName属性,其返回值是一样的. <p id=" ...

  2. 第四章 JavaScript操作DOM对象

    第四章   JavaScript操作DOM对象 一.DOM操作 DOM是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API接口,1988年,W3C发布了第一级 ...

  3. javascript四种类型识别的方法

    × 目录 [1]typeof [2]instanceof [3]constructor[4]toString 前面的话 javascript有复杂的类型系统,类型识别则是基本的功能.javascrip ...

  4. javascript之DOM(一节点类型Node)

    DOM(Document Object Model)是针对HTML和XML文档的一个API.DOM描述的是一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.起源于DHML,现为W3C的推 ...

  5. JavaScript网站设计实践(四)编写about.html页面,利用JavaScript和DOM,选择性的显示和隐藏DIV元素

    一.现在我们在网站设计(三)的基础上,来编写about.html页面. 这个页面要用到的知识点是利用JavaScript和DOM实现选择性地显示和隐藏某些DIV about.html页面在前面我们为了 ...

  6. JavaScript 操作 DOM 常用 API 总结

    文本整理了javascript操作DOM的一些常用的api,根据其作用整理成为创建,修改,查询等多种类型的api,主要用于复习基础知识,加深对原生js的认识. 基本概念 在讲解操作DOM的api之前, ...

  7. 第一百一十六节,JavaScript,DOM操作样式

    JavaScript,DOM操作样式 一.操作样式 CSS作为(X)HTML的辅助,可以增强页面的显示效果.但不是每个浏览器都能支持最新的CSS能力.CSS的能力和DOM级别密切相关,所以我们有必要检 ...

  8. 使用原生 JavaScript 操作 DOM

    原文:https://www.sitepoint.com/dom-manipulation-vanilla-javascript-no-jquery/ 微软官方放弃了 IE10-,所以现在可以放心使用 ...

  9. 第十五章:Python の Web开发基础 (二) JavaScript与DOM

    本課主題 JavaScript 介绍 DOM 介绍 JavaScript 介绍 JavaScript 是一门编程语言,它可以让网页动起来的,JavaScript 的变量有两种,一个是局部变量:一个是全 ...

随机推荐

  1. Matlab c2d()函数的用法

    1.c2d()函数的用法 c2d()函数的作用是将s域的表达式转化成z域的表达式,s=0对应z=1. c2d()函数转化的方法有多种: ①zoh, 零阶保持器法,又称阶跃响应不变法: ②foh ,一阶 ...

  2. Educational Codeforces Round 59 (Rated for Div. 2) E 区间dp + 状态定义 + dp预处理(分步dp)

    https://codeforces.com/contest/1107/problem/E 题意 给出01字符串s(n<=100),相邻且相同的字符可以同时消去,一次性消去i个字符的分数是\(a ...

  3. windwos文件句柄数限制

    1.修改注册表,位置如下: HKEY_LOCAL_MACHINE/SOFTWARE/Microsoft/Windows NT/CurrentVersion/Windows 2.设置 1.GDIProc ...

  4. Magisk —— 安卓新一代的第三方拓展,systemless模式

    Magisk由宝岛台湾学生 topjohnwu 开发, XDA主贴:https://forum.xda-developers.com/apps/magisk 使用方法:第三方rec刷入zip 介绍: ...

  5. AI语音验证码识别

    欢迎使用AI语音验证码识别v4.0程序程序调用方法:http://code.hbadmin.com/?url=http://code.hbadmin.com/demo/2118534.wav [试听] ...

  6. nginx ubantu 安装步骤

    Ubuntu14.04默认安装的是Nginx 1.4.6 如果已经安装,请先卸载sudo apt-get remove nginx最新的稳定版Nginx 1.6.0在ubuntuupdates ppa ...

  7. [解決方案]IIS配置后报错500.21

    如果报错这个信息,那么就是aspnet未注册造成的,需要安装一下 步骤: 1.打开CMD 2.输入cd %windir%\Microsoft.Net\Framework\v4.0.30319 3.执行 ...

  8. c# .net core + .net framework mongodb nuget 包

    FastNet.Framework.Mongo https://github.com/my-core/FastNet.Framework GH.MongoDb.GenericRepository ht ...

  9. Linux内核同步机制之原子操作

    1.前言 原子操作指的是该操作不会在执行完毕之前被任何其它任务或事件打断,它是最小的执行单位,不会有比它更小的执行单位,原子实际上使用了物理学中物质微粒的概念,在Linux内核中,原子操作需要硬件的支 ...

  10. 利用mysql的LOAD DATA INFILE的功能读取客户端文件

    前言:今天在浏览某知论坛时,看到某大佬在渗透过程中使用伪造的MySQL服务端读取客户端文件,此大佬在利用过程中描述得不是很详细,作为小白的我看不懂啊,由此产生了此篇文章. 某大佬文章:https:// ...