简单的DOM操作

来源:互联网 发布:ui用什么软件 编辑:程序博客网 时间:2024/05/16 07:59
1.几个常用的dom操作函数
        1)appendChild();
        2)insertBefore(newNode,posNode)
        3)replaceChild(newNode,oldNode)
        4)removeChild(node)
 要想是i用这几个方法必须先取得父节点(使用parentNode属性)
2.两个所有类型的节点都有的方法。
       a.cloneNode();该方法接受一个boolean值,表示是否执行深复制。
        使用cloneNode()复制完成后还要利用 1)appendChild();insertBefore(newNode,posNode))replaceChild(newNode,oldNode)将它添加到文档中。
    3.innerText,innerHtml,outText,outHtml属性
    4.动态脚本        
        创建动态脚本有两种方式:插入外部文件和直接插入javascript代码
        动态加载外部脚本的函数封装:
        
         指定javascript代码的行内方式:为了兼容IE必须使用script元素的text属性:
                function loadScriptString(code)
                {
                        var script = document.createElement("script");
                        script.type='text/script';
                        script.text = code;
                        document.body.appendChild(script);
                }
    5.动态样式
        能够吧CSS样式动态的包含到HTML页面中的元素有两个:link 和style
        1.使用link:
                function  loadStyles(url)
                {
                        link.rel = "stylesheet";
                        linke.type = "text/css";
                        link.ref = url;
                        var head = document.getElementByTagName("head")[0];
                        head.appendChild(link);
                }
        2.使用style:
                function loadStyleString(css)
                {
                        var style = document.creatElement('style');
                        style.type = "text/css";
                        try{
                                //对非IE浏览器
                                style.appendChild(dcoument.createTextNode(css));
                                
                        }catch(ex)
                        {
                                //IE浏览器产生异常
                                 style.styleSheet.cssText = css;       
                        }
                  }


               
原创粉丝点击