Edgewall Software
Last modified 2 weeks ago

CmToc?

PageTemplates/templ?

newPage?

Table Field
My table my field

Una pruebita

DOM是一组用来描述脚本怎样与结构化文档进行交互和访问的Web标准。

DOM不是javascript，DOM不是DHTML，它是一个标准。

代码： 

 <html>
   <head>
   <title>HTML DOM</title>
   </head>
   <body>
   <h1>DOM的结构</h1>
   <p><a href="href">链接</a></p>
   </body>
 </html>

表示为DOM结构就如下图：

2.DOM中的层次

DOM继承关系如下图：

DOM中最基础的节点为Node。

节点种类解释产生方式
Element 表示起始标签和结束标签之间的内容，例如<tag></tab>或者<tag/>。这是唯一可以同时包含特性和子节点的节点类型。 document.createElement(tagName)
Attr代表一对特性名和特性值。这个节点类型不能包含子节点。 document.createAttribute(name)
Text 代表XML文档中的在起始标签和结束标签之间，或者CDataSection内包含的普通文本。这个节点类型不能包含子节点。document.createTextNode(text)
Comment 代表XML注释。这个节点不能包含子节点。 document.createComment(text)
Document 最顶层的节点，所有的其他节点都是附属于它的 一直存在
DocumentFragment?可以像Document一样来保存其他节点。 document.createDocumentFragment()
DocumentType?DTD引用（使用<!DOCTYPE>语法）的对象表现形式，它不能包含子节点。 ?
CDataSection<![CDATA[]]>的对象表现形式。这个节点类型仅能包含文本节点Text作为子节点。 document.createCDataSection(data)
Entity 表示在DTD中的一个实体定义，例如<!ENTITY foo"foo">。这个节点类型不能包含子节点。 ?
EntityReference?代表一个实体引用，例如&quot;。这个节点类型不能包含子节点。 document.createEntityReference(name)
ProcessingInstruction? 目标的名称。document.createProcessingInstruction(target,data)
Notation 代表在DTD中定义的记号。这个很少用到。 ?

3.常用对象及方法

核心对象Document

1.它能创建其它节点的工作

各种个样的document.createXXX()方法

2.查找Element对象,主要用到两个方法

document.getElementById(id);

document.getElementsByTagName(tagName);

常用方法：

createElement()、createTextNode()、appendChild() 

<html>
    <head>
        <title>createElement() Example</title>
        <script type="text/javascript">
            function createMessage() {
                var oP = document.createElement("p");
                var oText = document.createTextNode("Hello World!");
                 oP.appendChild(oText);
                 document.body.appendChild(oP);
             }
        </script>
    </head>
    <body onload="createMessage()">
    </body>
</html>

removeChild()、replaceChild()、insertBefore()

删除节点 

<html>
    <head>
        <title>removeChild() Example</title>
        <script type="text/javascript">
            function removeMessage() {
                var oP = document.body.getElementsByTagName("p")[0];
                 oP.parentNode.removeChild(oP);
             }
        </script>
    </head>
    <body onload="removeMessage()">
        <p>Hello World!</p>
    </body>
</html>

替换 

<html>
    <head>
        <title>replaceChild() Example</title>
        <script type="text/javascript">
            function replaceMessage() {
                var oNewP = document.createElement("p");
                var oText = document.createTextNode("Hello Universe!");
                 oNewP.appendChild(oText);
                var oOldP = document.body.getElementsByTagName("p")[0];
                 oOldP.parentNode.replaceChild(oNewP, oOldP);
             }
        </script>
    </head>
    <body onload="replaceMessage()">
        <p>Hello World!</p>
    </body>
</html>

新文本添加到旧文本之前 

<html>
    <head>
        <title>insertBefore() Example</title>
        <script type="text/javascript">
            function insertMessage() {
                var oNewP = document.createElement("p");
                var oText = document.createTextNode("Hello Universe!");
                 oNewP.appendChild(oText);
                var oOldP = document.getElementsByTagName("p")[0];
                 document.body.insertBefore(oNewP, oOldP);
             }
        </script>
    </head>
    <body onload="insertMessage()">
        <p>Hello World!</p>
    </body>
</html>
  1. one
  1. two
  1. three
  1. four
  1. five
  1. six
  1. seven
  1. eight
  1. nine
  1. ten
  1. eleven
  1. twelve
  1. thirteen
  1. fourteen
  1. fifteen
  1. sixteen
  1. seventeen
  1. eithteen
  1. nineteen
  1. twenty
  1. twenty one
  1. twenty two
  1. 二十三

page de test?

Attachments