javascript之DOM技術(一)

時間 2019-12-28

原文原文鏈接

TEXT_NODE                                         3
CDATA_SECTION_NODE                 4
ENTITY_REFERENCE_NODE            5
ENTITY_NODE                                     6
PROCESSING_INSTRCTION_NODE       7
COMMENT_NODE                             8
DOCUMENT_NODE                            9
DOCUMENT_TYPE_NODE               10
DOCUMENT_FRAGMENT_NODE   11
NOTATION_NODE                              12html

IE6不支持，不過你能夠自定義一個JS對象Node。

3.處理特性
處理特性能夠使用標準的NameNodeMap中的方法：
getNamedItem(name) removeNamedItem(name) setNamedItem(node)    item(pos)

好比:<p id="test">測試</p>
假設變量oP是上面的p節點的引用，咱們要訪問oP的id屬性:
var sId=oP.attributes.getNamedItem("id").nodeValue;

這些方法用起來很累贅,因此DOM又定義了三個方法來簡化:
getAttribute(name)         ——返回名稱爲name的屬性的值
setAttribute(name,value) ——顧名思義
removeAttribute(name)    ——顧名思義

上面的例子能夠改寫爲：
var sId=oP.getAttribute("name");

4.訪問指定節點：
熟知的getElementByTagName(name),getElementByName(name),getElementById(id)三個方法，再也不展開。

5.建立和操做節點：
（1）建立新節點，一張IE(6.0)和FF對DOM Level1的建立新節點方法支持的對照表：
java

方法                                                               IE                               FF
createAttribute(name)                                 Y                                Y
createCDATASection(text)                       N                                Y
createComment(text)                                    Y                                Y
createDocumentFragment()                        Y                                Y
createElement(tagName)                            Y                                 Y
createEntityReference(name)                    N                                 Y
createProcessingInstruction(
target,data)                                                 N                                  Y
createTextNode(text)                               Y                                   Ynode

下面介紹經常使用的幾個方法

（2）createElement(),createTextNode(),appendChild()
例子：
app

<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>
ide