javascript之DOM(四其他类型)
一、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(四其他类型)的更多相关文章
- javascript之DOM(三Element类型)
Element类型用于表现XML和HTML的元素,提供了对元素标签名.子节点及特性的访问. 要访问标签名可以使用nodeName和tagName属性,其返回值是一样的. <p id=" ...
- 第四章 JavaScript操作DOM对象
第四章 JavaScript操作DOM对象 一.DOM操作 DOM是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API接口,1988年,W3C发布了第一级 ...
- javascript四种类型识别的方法
× 目录 [1]typeof [2]instanceof [3]constructor[4]toString 前面的话 javascript有复杂的类型系统,类型识别则是基本的功能.javascrip ...
- javascript之DOM(一节点类型Node)
DOM(Document Object Model)是针对HTML和XML文档的一个API.DOM描述的是一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.起源于DHML,现为W3C的推 ...
- JavaScript网站设计实践(四)编写about.html页面,利用JavaScript和DOM,选择性的显示和隐藏DIV元素
一.现在我们在网站设计(三)的基础上,来编写about.html页面. 这个页面要用到的知识点是利用JavaScript和DOM实现选择性地显示和隐藏某些DIV about.html页面在前面我们为了 ...
- JavaScript 操作 DOM 常用 API 总结
文本整理了javascript操作DOM的一些常用的api,根据其作用整理成为创建,修改,查询等多种类型的api,主要用于复习基础知识,加深对原生js的认识. 基本概念 在讲解操作DOM的api之前, ...
- 第一百一十六节,JavaScript,DOM操作样式
JavaScript,DOM操作样式 一.操作样式 CSS作为(X)HTML的辅助,可以增强页面的显示效果.但不是每个浏览器都能支持最新的CSS能力.CSS的能力和DOM级别密切相关,所以我们有必要检 ...
- 使用原生 JavaScript 操作 DOM
原文:https://www.sitepoint.com/dom-manipulation-vanilla-javascript-no-jquery/ 微软官方放弃了 IE10-,所以现在可以放心使用 ...
- 第十五章:Python の Web开发基础 (二) JavaScript与DOM
本課主題 JavaScript 介绍 DOM 介绍 JavaScript 介绍 JavaScript 是一门编程语言,它可以让网页动起来的,JavaScript 的变量有两种,一个是局部变量:一个是全 ...
随机推荐
- linux的cpu使用率
linux 上一个核占满是 100%,双核机器占满整个 CPU 是 200%
- 洛谷P2996 [USACO10NOV]拜访奶牛Visiting Cows
题目 树形dp 设f[i][j]表示走到第i号节点的最大权值 j为0/1表示这个点选或者不选 如果这个点不选 就从他的子树里的选或者不选选最大 如果这个点选 就加上他子树的不选 f[x][0] += ...
- CSP2019 树的重心 题解
本题当然可以通过大力讨论每棵子树的size的大小关系,然后用各种数据结构暴力维护.但是我更倾向于用一种更为性质的做法. 首先讲一下我在考场上想到的做法(没写).就是考虑换根,在换根的过程中计算每一条边 ...
- Linux性能优化实战学习笔记:第三十八讲
一.上节回顾 上一节,我们学习了 DNS 性能问题的分析和优化方法.简单回顾一下,DNS 可以提供域名和 IP 地址的映射关系,也是一种常用的全局负载均衡(GSLB)实现方法. 通常,需要暴露到公网的 ...
- java 多行注释
public class Sample { public static void main(String[] args) { // java compiler ignores the comment ...
- 国家集训队 Crash 的文明世界(第二类斯特林数+换根dp)
题意 题目链接:https://www.luogu.org/problem/P4827 给定一棵 \(n\) 个节点的树和一个常数 \(k\) ,对于树上的每一个节点 \(i\) ,求出 \( ...
- web版聊天功能简单实现
一.问题 核心点:如何找到要发送的人? 要完成一个功能我觉得首先要分析该功能的逻辑及技术难点,而不是盲目的直接就撸代码,这样非常浪费时间.个人觉得web版聊天功能没什么实际应用场景,以前看过中国移动好 ...
- 通过欧拉计划学Rust(第1~6题)
最近想学习Libra数字货币的MOVE语言,发现它是用Rust编写的,看来想准确理解MOVE的机制,还需要对Rust有深刻的理解,所以开始了Rust的快速入门学习. 看了一下网上有关Rust的介绍,都 ...
- 排列组合(包括n中随机抽取m个)
有些情况我们需要获取一个数组中的所有排列组合情况,或者获取一部分数据进行随机组合,这个在python中有一个模块可以实现.具体情况如下 :::::::::::::::::::::::::::::::: ...
- SQL ------------ avg() 与 sum 函数
AVG() 函数返回数字列的平均值 注意是数字的平均数, 语法: select avg(字段) from 表名 建个表,弄点数据 使用 select avg(字段) as 平均数 from 表名 与w ...