DOM基础教程之使用DOM

内容摘要

在了解DOM(文本对象模型)的框架和节点后，最重要的是使用这些节点处理html网页
对于一个DOM节点node，都有一系列的属性和方法可以使用。常用的有下表。

完善：http://www.w3scho

文章正文

在了解DOM(文本对象模型)的框架和节点后，最重要的是使用这些节点处理html网页

对于一个DOM节点node，都有一系列的属性和方法可以使用。常用的有下表。

完善：http://www.w3school.com.cn/xmldom/dom_element.asp

1.访问节点

BOM提供了一些边界的方法访问节点，常用的就是getElementsByTagName()，和getElementById()

http://www.qq.com");
                var ootextP = document.createTextNode("链接");
                oonewP.appendChild(ootextP);
                insertAfter(oonewP, ooParent);
            }
        </script>
    </body>

实例：元素内添加

12.添加文档碎片提高执行效率

复制代码代码如下:

    <head>

        <title>childNodes</title>

        <meta charset="utf-8" />

        <script language="javascript">

            window.onload = function() {

    var oPold = document.getElementsByTagName("p")[0];

    var aColors = ["red","green","blue","magenta","yellow","chocolate","black","aquamarine","lime","fuchsia","brass","azure","brown","bronze","deeppink","aliceblue","gray","copper","coral","feldspar","orange","orchid","pink","plum","quartz","purple"];

    var oFragment = document.createDocumentFragment();    //创建文档碎片

    for(var i=0;i<aColors.length;i++){

        var oP = document.createElement("p");

        var oText = document.createTextNode(aColors[i]);

        oP.appendChild(oText);

        oFragment.appendChild(oP);        //将节点先添加到碎片中

    }

    //document.body.appendChild(oFragment);    //最后一次性添加到页面

     oPold.parentNode.insertBefore(oFragment,oPold);//结合insertBefore使文档碎片添加到节点之前

            }

        </script>

    </head>

    <body>

    <p>这里本来有个P</p>

    </body>

代码注释

上一篇 php获取文件后缀的9种方法下一篇 CSS3中使用RGBa来调节透明度的教程

作者：喵哥笔记

学的不仅是技术，更是梦想！