• JavaScript高级程序设计25.pdf


    Text类型

    文本类型由Text类型表示,包含纯文本内容,可以包含转义后的HTML字符,但不能包含HTML代码。Text节点具有以下特征:

    nodeType的值为3;

    nodeName的值为"#text";

    nodeValue的值为节点所包含的文本;

    parentNode是一个Element;

    不支持(没有)子节点

    可以通过nodeValue属性或data属性访问Text节点中包含的文本,这两个属性中包含的值相同,对nodeValue的修改也会通过data反映出来。可以使用下列方法操作节点中的文本:

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

    deleteData(offset,count);  从offset指定的位置开始删除count个字符;

    insertData(offset,text);  从offset指定的位置开始插入text;

    replaceData(offset,count,text);  用text替换从offset指定的位置开始的count个字符;

    splitText(offset);  从offset指定的位置将当前文本分成两个文本节点;

    substringData(offset,count);  提取从offset指定的位置开始到count个字符串

    除了上述方法,文本节点还有一个length属性,保存着字符的数目nodeValue.length==data.length

    每个可以包含内容的元素最多只能有一个文本节点,而且必须确实有内容存在

    <!--没有内容,也就没有文本节点-->

    <div></div>

    <!--空格也算一个文本节点-->

    <div> </div>

    取得文本节点的引用,并修改它

    div.firstChild.nodeValue="some other message";

    在修改文本节点的时候还要注意此时的字符串会经过HTML或XML编码,大于号小于号或引号或被转义。

    创建文本节点

    var textNode=document.createTextNode("<strong>Hello</strong> world!");  //也会被编码

    在创建新文本节点的同时也会为其设置ownerDocument属性

    如果两个文本节点是相邻的同胞节点,那么两个节点的文本就会连起来显示,中间不会有空格

    规范文本节点

    DOM文档中相邻的同胞文本节点很容易导致混乱,搞不清楚哪个文本节点表示哪个字符串,于是催生了一种方法normalize(),要在拥有2个或者多个的文本节点的父元素调用normalize()方法,会将所有文本节点合并成一个节点,结果节点的nodeValue等于合并前每个文本节点拼接起来的值

    分隔文本节点

    splitText(5);  //第二段文本从第5个位置开始

    Comment类型

    注释在DOM中通过Comment类型表示,它具有下列特征

    nodeType的值为8;

    nodeName的值为"#comment";

    nodeValue的值是注释的内容;

    parentNode可能是Document或Element;

    不支持(没有)子节点

    Comment类型与Text类型继承自相同的基类,它拥有除了splitText()之外的所有字符串操作方法。与Text类型相似,也可以通过nodeValue或data属性取得注释的内容

    <div id="myDiv"><!--A comment--></div>

    var div=document.getElementById("myDiv");

    var comment=div.firstChild;

    alert(comment.data);  //"A comment"

    创建注释文本

    document.createComment()

    CDATASection类型

    CDATASetion类型只针对基于XML的文档,表示的是CDATA区域。继承自Text类型,它拥有除了splitText()之外的所有字符串操作方法。

    nodeType的值为4;

    nodeName的值为"#cdata-section";

    nodeValue的值是CDATA区域中的内容;

    parentNode可能是Document或Element;

    不支持(没有)子节点。

    document.createCDataSection()创建CDATA区域

    DocumentType类型

    DocumentType类型在Web浏览器中并不常用,它包含着与文档doctype有关的所有信息,具有下列特征

    nodeType的值为10;

    nodeName的值为doctype的名称;

    nodeValue的值为null;

    parentNode是Document;

    不支持(没有)子节点。

    DocumentFragment类型

    在所有节点类型中,只有DocumentFragment在文档中没有对应的标记。DOM规定文档片段(document fragment)是一种“轻量级”的文档,可以包含和控制节点,但不会像完整文档那样占用额外的资源,DocumentFragment节点具有下列特征:

    nodeType的值为11;

    nodeName的值为“#document-fragment”;

    nodeValue的值为null;

    parentNode的值为null;

    子节点可以是Element、ProcessingInstruction、Comment、Text、CDATASection或EntityReference。

    虽然不能把文档片段直接添加到文档中,但可以将它作为一个“仓库”来使用,里面保存将来可能会被添加到文档中的节点,可以使用document.createDocumentFragment()方法创建文档片段。

    var fragment=document.createDocumentFragment();  //不需要参数

    文档片段继承了Node的所有方法。通常用于执行那些针对文档的DOM操作

    在将文档片段作为参数传递给appendChild()或insertBefore()时,实际上只会将文档片段的所有子节点添加到相应位置上

    Attr类型

    元素的特性在DOM中以Attr类型来表示,在所有浏览器中都可以访问Attr类型的构造函数和原型。从技术角度讲,特性就是存在于元素的attributes属性中的节点,特性节点具有下列特征:

    nodeType的值为11;

    nodeName的值是特性的名称;

    nodeValue的值就是特性的值;

    parentNode的值为null;

    在HTML中不支持(没有)子节点;

    在XML中子节点可以是Text或EntityReference。

    尽管它们也是节点,但特性却不被认为是DOM文档树的一部分。

    Attr对象有3个属性:name、value和specified,其中name是特性名称(nodeName),value是特性的值(nodeValue),specified是一个布尔值,用以区别特性是代码中指定的还是默认的

    使用document.createAttribute()并传入特性的名称可以创建新的特性节点

    var attr=document.createAttribute("align");

    attr.value="left";

    element.setAttributeNode(attr);  //添加特性

    alert(element.attributes["align"].value);  //"left"

    alert(element.getAttributeNode("align").value);  //"left"

    alert(element.getAttribute("align"));  //"left"

  • 相关阅读:
    redis配置文件参数说明及命令操作
    在Window 下安装Redis数据库
    eclipse怎样在线安装hibernate tools插件并使用
    eclipse如何优化构建的速度(Building)
    java实现敏感词过滤(DFA算法)
    eclipse编码格式设置
    Jquery Ajax简单封装(集中错误、请求loading处理)
    Vue简单封装axios—解决post请求后端接收不到参数问题
    vue项目实现记住密码功能
    vue路由的两种模式配置以及history模式下面后端如何配置
  • 原文地址:https://www.cnblogs.com/sdgjytu/p/3752817.html
Copyright © 2020-2023  润新知